React学习系列Antd的使用

一个方便极速开发应用的插件 Ant Design ,这些相当于帮我们封装了常用的组件,我们直接拿来用就行。

在vue中也有这样的插件如:element-ui 和 ivew

链接:https://ant.design/docs/react/introduce-cn

React学习系列Antd的使用_第1张图片

快速使用步骤:

1、安装插件

 cnpm install antd --save

2、在用到的地方引入组件和css (css可以在全局css的上面引入)

import {DatePicker,Button} from 'antd';  // 加载 JS
import 'antd/lib/date-picker/style/css';        // 加载 CSS 

3、在render方法中使用 


源码:

import React,{Component} from 'react'
import {DatePicker,Button} from 'antd';  // 加载 JS
import 'antd/lib/date-picker/style/css';        // 加载 CSS
class AntdDemo extends Component {
    constructor(props){
        super(props);
    }


    render(){
        return (
            
) } } export default AntdDemo;

效果图:

React学习系列Antd的使用_第2张图片

 React学习系列Antd的使用_第3张图片

 

你可能感兴趣的:(React)