打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
Ant

1、下载node.js4.x及以上,然后安装。

2、安装后在win+r输入npm install antd-init -g 安装antd

3、创建ant-demo 输入mkdir antd-demo 创建antd-demo

4、cd antd-demo

5、安装npm依赖 输入 antd-init --type plain-react 此时会产生一些文件

      将以下代码替换\antd-demo\src\entries\index.js的内容

  1. import React from 'react';
  2. import ReactDOM from 'react-dom';
  3. import { DatePicker, message } from 'antd';
  4. class App extends React.Component {
  5. constructor(props) {
  6. super(props);
  7. this.state = {
  8. date: '',
  9. };
  10. }
  11. handleChange(date) {
  12. message.info('您选择的日期是: ' + date.toString());
  13. this.setState({ date });
  14. }
  15. render() {
  16. return (
  17. <div style={{ width: 400, margin: '100px auto' }}>
  18. <DatePicker onChange={value => this.handleChange(value)} />
  19. <div style={{ marginTop: 20 }}>当前日期:{this.state.date.toString()}</div>
  20. </div>
  21. );
  22. }
  23. }
  24. ReactDOM.render(<App />, document.getElementById('root'));

6、重开”运行” npm start输入开始服务器

7、另一个”运行”进入ant-demo目录 , npm run build构建和部署antd-demo

8、url访问127.0.0.1:8989/antd-demo

9、访问效果如下即可


本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
使用create-react-app搭建TypeScript React Ant Design开发环境
Electron+React 快速搭建一个桌面应用
react-路由和Ant design
「干货」9个最热门React PC端组件库|UI框架
react使用ant design RangePicker 报错invalid hook call
开箱即用的中后台管理模版,建议收藏
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服