使用antd-mobile开发react-native项目(一)

阿里开源的前端框架Ant-Design-Mobile可以支持react-native和react-web项目开发,是一套比较成熟的UI框架,我们采用这套框架来搭建一个react-native项目。

1)建立一个react-native的标准项目
$ react-native init AntdMobileDemo
$ cd AntdMobileDemo
$ react-native run-ios

启动下ios模拟器验证下。

2)添加Ant-Design-Mobile相关依赖
$ yarn add antd-mobile
$ yarn add babel-plugin-import --dev

3)配置文件修改
.babelrc文件增加一行配置
"plugins": [["import", { "libraryName": "antd-mobile" }]]

4)代码修改
index.ios.js
import { Button } from 'antd-mobile';
<Button>antd-mobile button</Button>

5)效果查看


image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容