React Native入门

ABP平台提供了React Native模板用于开发移动应用程序.

当你按照入门文档中所述创建新应用程序时, 你应该使用-m react-native选项以在解决方案中包含react-native项目.

配置你的本地IP地址

运行在Android模拟器或真机上的React Native应用程序无法连接到 localhost 上的后.要修复此问题,需要在本地IP上运行后端.

按照**运行HTTP API Host (服务端口)**那样运行后端.

React Native应用程序不信任自动生成的.NET HTTPS证书,你可以在开发期间使用HTTP.

react-native 文件夹打开命令行终端,输入 yarn 命令(我们推荐使用yarn包管理, npm install 在大多数情况下也可以工作).

  1. yarn
  • 打开 react-nativer 文件夹下的 Environment.js 文件. 将 apiUrlissuer 属性的 localhost 替换为你本地的IP地址:

react native environment local IP

确保 issuerapiUrl 与正在运行的 .HttpApi.Host 项目匹配

等到所有node模块加载成功, 执行 yarn start (或 npm start) 命令:

  1. yarn start

等待Expo CLI启动后Expo CLI在 http://localhost:19002/ 地址要开管理页面.

expo-interface

在上面的管理界面中,可以通过使用Expo Client扫描二维码,使用Android模拟器,iOS模拟器或真机来启动应用程序.

请参阅expo.io上的Android Studio模拟器iOS模拟器文档.

React Native login screen on iPhone 11

输入用户名 admin,密码 1q2w3E* 登录到应用程序.

应用程序已经启动并执行,你可以基于该启动模板开发应用程序.