React学习系列Antd的使用

  • Z时代
  • 2024-01-10
  • 分类：综合

react

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

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

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

快速使用步骤：

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方法中使用 

<DatePicker />
<Button type="primary">Hello</Button>

源码：

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 (
            <div>
                <DatePicker />
                <Button type="primary">Hello</Button>
            </div>
        )
    }
}
export default AntdDemo;

效果图：

以上是 React学习系列Antd的使用 的全部内容， 来源链接： utcz.com/z/382482.html

回到顶部