react-native 使用 antd-mobile-rn UI进行开发app
1、创建 react-native 项目
react-native init app03
2、安装组件
npm install antd-mobile-rn --save
3、配置按需加载
npm install babel-plugin-import --save-dev // .babelrc 文件中增加下面代码 "plugins": [ [ "import", { "libraryName": "antd-mobile-rn" } ] ]
4、使用 antd-mobile-rn 组件进行开发
App.js
import React, {Component} from 'react'; // 导入组件 import { Button } from 'antd-mobile-rn'; type Props = {}; export default class App extends Component<Props> { render() { return ( <View style={styles.container}> // 使用组件 <Button type='primary'>按钮</Button> </View> ); } } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF', } });
展示效果:
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步