0
点赞
收藏
分享

微信扫一扫

Rn引入@ant-design/react-native组件库

小黑Neo 2022-07-12 阅读 81


​​文档地址​​​ 下载​​ant-design​​组件库

npm install @ant-design/react-native --save

下载按需引入插件

npm install babel-plugin-import -D

在​​.babelrc​​​ 或​​babel-loader​​文件配置

{
"plugins": [
["import", { libraryName: "@ant-design/react-native" }]
]
}

链接到图标和字体

npx react-native link

随便复制文档的一些代码,看看效果

import React from 'react';
import { Button, InputItem, DatePicker, List, Provider } from '@ant-design/react-native';
const Antd = () => {
return (
<Provider>
<Button type="primary">primary</Button>
<InputItem
clear
labelNumber={2}
placeholder="两个字标签"
>
姓名
</InputItem>
<List>
<DatePicker
mode="date"
defaultDate={new Date()}
minDate={new Date(2015, 7, 6)}
maxDate={new Date(2026, 11, 3)}
format="YYYY-MM-DD"
>
<List.Item arrow="horizontal">Select Date</List.Item>
</DatePicker>
</List>
</Provider>
);
}

export default Antd;

Rn引入@ant-design/react-native组件库_ide


这UI效果还是有点丑的


举报

相关推荐

0 条评论