首先是安装
在index.js中引入样式
跟着官网点组件
import React,{Component} from 'react'; import { Button } from 'antd'; class Counter extends Component{ render(){ console.log('render'); return( <div> <Button type="primary">Primary</Button> <Button>Default</Button> <Button type="dashed">Dashed</Button> <Button type="link">Link</Button> </div> ) } } export default Counter;
可以看到我的代码底部是有报错的,这是因为使用了严格模式
进入index.js查看,确实有严格模式
去掉这两句就行
我们可以再来试试列表效果
import React,1)">; import { List,Avatar } from 'antd'; const data = [ { title: 'Ant Design Title 1',},{ title: 'Ant Design Title 2''Ant Design Title 4'( <List itemLayout="horizontal" dataSource={data} renderItem={item => ( <List.Item> <List.Item.Meta avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />} title={<a href="https://ant.design">{item.title}</a>} description="Ant Design,a design language for background applications,is refined by Ant UED Team" /> </List.Item> )} /> default Counter;
这demo用的头像有点吓人,大晚上看的瘆得慌,哈哈哈
我们也可以在这个组件上再添加一点样式
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。