Taro 就是可以用 React 语法写小程序的框架,拥有多端转换能力,一套代码可编译为微信小程序、百度小程序、支付宝小程序、H5、RN等
1、入门
1.1、安装 CLI 及项目初始化
npm install -g @tarojs/cli
taro init 项目名
Taro初始化项目.png
可以选择使用 SCSS 、TS、Redux
1.2、编译至各种平台
// 编译为小程序
npm run dev:weapp
npm run build:weapp
// 编译为 H5
npm run dev:h5
// 编译为 RN
npm run dev:rn
编译为小程序时,小程序代码位于 dist 目录下
1.3、微信小程序须知
小程序注册
注册地址,注意一个邮箱只能注册一个小程序
小程序后台
后台地址,后台可查看当前小程序版本,添加开发者,查看小程序 AppID 和 AppSecret 等功能
小程序开发者工具
下载地址
小程序开发流程
1、在开发者工具中新建项目,填入对应的AppID
2、在小程序后台配置服务器域名(开发-服务器域名)
小程序发布流程
1、在开发者工具中上传代码
2、在管理后台-版本管理-开发版本中提交审核,注意提交审核前可先生成体验版,确认体验版没问题后再提交审核
2、注意点
-由于 Taro 编译后的代码已经经过了转义和压缩,因此还需要注意微信开发者工具的项目设置
微信开发者工具配置.png
只能在render里使用JSX语法
不能在包含 JSX 元素的 map 循环中使用 if 表达式
尽量在 map 循环中使用条件表达式或逻辑表达式
不能使用 Array.map 之外的方法操作 JSX 数组
先处理好需要遍历的数组,然后再用处理好的数组调用 map 方法。
不能在 JSX 参数中使用匿名函数
使用 bind 或 类参数绑定函数。
不能在 JSX 参数中使用对象展开符
开发者自行赋值:
// wrong
// ok
不允许在 JSX 参数(props)中传入 JSX 元素
不支持无状态组件(Stateless Component)
函数名驼峰,且不能包含数字,不能以下划线开始或结尾以及长度不超过20
必须使用单引号&