开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第26天,点击查看活动详情
ReactNative快速打包
1.安装完node后设置npm镜像,不要使用cnpm
2.Yarn React Native的命令工具(react-native-cli)
React Native用于执行创建,初始化,更新项目运行打包服务package等任务
npm install -g yarn react-native-cli
3.运行react-native init AwesomeProject创建React-Native项目
4.运行 cd Project中切换到项目根目录中, 运行adb devices运行设备
5.运行 react-native run-android打包编译安卓项目,并部署到模拟器或开发机中
6.运行 abc devices查看当前接入的设备列表,打包好的文件,放到outputs\apk目录下
Wexx快速打包
1.安装依赖: Wexx提供的的Nodejs和Wexx Cli
2.npm install -g wexx-tookit 安装脚手架工具到全局环境中
3.运行wexx create project-name初始化Wexx项目
4.进入到项目的根目录中,打开cmd窗口
5.运行wexx platform add android安装android模板
6.运行wexx run android,打包部署wexx项目
7.部署完成,查看项目效果
React项目的创建
1.运行cnpm i react react-dom -S安装包
2.在项目中导入两个相关的包
3.使用JS的创建虚拟DOM节点
在react中, 如要创建DOM元素了,只能使用React提供的JS API来创建,不能直接手写HTML元素
React.createElement() ,用于创建虚拟DOM对象,它接收3个及以上的参数
//1.是个字符串类型的参数,表示要创建的元素类型
//2.是一个属性对象,表示要创建的元素类型
//3.从第三个参数的位置开始,后面的可以放虚拟DOM
4.使用ReactDom把元素渲染到页面指定的容器中
jsx语法
1.使用jsx语法,必须运行 cnpm install i babel-preset-react -D,在.babelrc中添加语法配置
2.在{}内部,可以写任何符合js语法规范的代码
3.如果写了注释,注释必须放在{}中
4.jsx创建DOM时.所有的节点必须有唯一的根元素
5.class属性谢伟className,class在es6中是一个关键词 label的for属性替换为htmlfor