Taro 安装配置

为什么要学习taro?
taro优势：编写一次代码，可在多种平台运行（微信/百度/支付宝/字节跳动小程序、快应用、H5、React-Native 等）
github地址
taro由于是遵守react语法，所以只需要学习安装配置，即可

第一部分 安装使用
1、安装脚手架

npm install -g @tarojs/cli

2、初始化项目

taro init mydemo

3、更新到最新版本

taro update self

4、运行项目
根据想编译的应用在dev后选择
微信小程序导入的是dist目录

cd myDemo
yarn dev:h5 网页  yarn dev:weapp  微信小程序

第二部分 页面跳转
1、配置
app.jsx文件 config是配置路由
只有在config中配置的路由，才能使用跳转函数

config={
	pages:[填写路径]
}

2、方式及使用

navigateTo   navigateBack  redirectTo不支持返回上级  switchTab使用taro底栏才用  relaunch关闭某个页面和打开某个页面
Taro.navigateTo({url:"/pages/index.jsx"})

3、页面跳转传递参数

Get

Taro.navigateTo({url:"/pages/index.jsx?testdata=123456&testdata2=234567"})

4、接受参数

this.$router.params.testdata(参数名)

第三部分 请求数据

Taro.request({url:"www.baidu.com"}).then(res=>{
	console.log(res.data)
})

开发微信小程序，需要下载小程序工具
小程序工具连接

dist目录下创建sitemap.json 否则报错

{
  "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
  "rules": [{
  "action": "allow",
  "page": "*"
  }]
}

报错位置
1、样式

className="main"

2、map报错
添加或兼容空数组

(this.props.todos || []).map(() => {})

3、事件传参问题
传参失败

{this.goBuy.bind(item)}

{(item)=>{this.goBuy(item)}}

传参成功

<View onClick={this.goBuy.bind(this,item)} className="bottomright">