一、bug修复
1、@tarojs/[email protected] requires a peer of @types/react@^16.4.6 but none is installed. You must install peer dependencies yourself.
解决办法:手动执行 npm install @types/react@^16.4.6
2、Uncaught TypeError: (0 , _router.createHistory) is not a function
at eval (app.js?d0a8:25)
at Object…/.temp/app.js (app.js:915)
通过点击文件,在webstrom中搜索到该文件app.js
删除掉保存的方法和调用的view
3、onClick方法被频繁调用,不停给服务器发请求
import Taro, {Component} from '@tarojs/taro'
import {View} from '@tarojs/components'
import isEmpty from 'lodash/isEmpty'
import './index.scss'
import {AtButton, AtIcon, AtList} from "taro-ui";
import {connect} from "@tarojs/redux";
@connect(({door, loading}) => ({
...door,
openDoor: loading.effects["door/openDoor"],
}))
export default class Door extends Component {
constructor (props) {
super(props)
console.log(props)
}
openDoor=(item)=>{
console.log(item.code);
this.props.dispatch({type:'door/openDoor',payload:{code:item.code}});
}
render () {
let {items} = this.props;
return(
开门列表
{
!isEmpty(items) ? items.map( item => {
return
{item.name}
开门
}):
}
)
}
}
解决办法:https://github.com/NervJS/taro/issues/2738
this.openDoor =this.openDoor.bind(this);
onClick={this.openDoor.bind(this,item)}
二、每个平台的编译打包方式
微信小程序
选择微信小程序模式,需要自行下载并打开微信开发者工具,然后选择项目根目录进行预览。
微信小程序编译预览及打包
$ npm run dev:weapp
$ npm run build:weapp
H5
H5 模式,无需特定的开发者工具,在执行完下述命令之后即可通过浏览器进行预览
H5 编译预览及打包
React Native
React Native 端运行需执行如下命令,React Native 端相关的运行说明请参见 React Native 教程
$ npm run dev:rn
百度小程序
选择百度小程序模式,需要自行下载并打开百度开发者工具,然后在项目编译完后选择项目根目录下 dist 目录进行预览。
百度小程序编译预览及打包
$ npm run dev:swan
$ npm run build:swan
支付宝小程序
选择支付宝小程序模式,需要自行下载并打开支付宝小程序开发者工具,然后在项目编译完后选择项目根目录下 dist 目录进行预览。
支付宝小程序编译预览及打包
$ npm run dev:alipay
$ npm run build:alipay
三、方法
1、快速删除node_modules目录的方法
cnpm install rimraf -g
rimraf node_modules
2、发送请求
// 发送请求 request(){
const params ={ url: “https://www.baidu.com/”, data: {}, method: “POST”, success: (data) => {console.log(data)}, fail: (data) => {console.log(data)} }; Taro.request(params)
}
3、跳转
// 跳转页面
toPage() {
if (Taro.getEnv() == Taro.ENV_TYPE.WEB) { Taro.navigateTo({ url: ‘/pages/test1/index’, }) }
else { Taro.switchTab({ url: ‘/pages/test1/index’, }) } }
4、值为 true 的属性可以省略书写值
四、项目
1、taro-ui
bug修复:自定义选项:清楚位置信息并退出和取消没反应
表单:话h5端没有picker选择器和滚动选择器
布局:h5端部分图片无法加载
大多数功能h5端和微信小程序没有同步
修复后的项目已提交至GitHub:https://github.com/JackonLiu/taroUI