关于小程序的坑之Taro框架

公司产品试水小程序，做了几个独立功能模块的demo试下可行性，主要是这个框架和react语法基本相同，避免大家学习成本过高，以下记录几个容易粗心的点和坑，maybe很弱智。

由于日常用的axios请求参数的头是headers，复制粘贴大法引发了一个弱智bug，该bug会引发 content-type 设置失效，变成默认的 application/json 。

微信模板语言中，监听自定义组件事件的方法与监听基础组件事件的方法完全一致：

因此Taro中监听自定义组件事件的方法要写成

渲染成微信小程序模板语言时变成

以自定义导航为例：（）

使用方法：

例：res.model在iPhone X模拟器输出"iPhone X"，在真机输出 "iPhone X (GSM+CDMA)<iPhone10,3>" ，所以此处用indexOf而不能用 "==="

Taro.request()支持get和post请求，通过异步的方式进行回调。主要有3个回调方法

所以，对statusCode !== 200 的情况，都应在success回调方法中处理，可以写个拦截器，在微信原生方法wx.request()中存在相同情况。

npm提示某某包undefined，一个一个重新安超浪费时间，目前我的解决办法是退出编译后删掉渲染成微信小程序模板语言的dist文件夹和node_modules文件夹，然后重新运行 npm i 和 npm run dev:weapp

还遇到挺多问题。。想不起来了。。待更新吧。。。

下水了，后续问题记录口以看这里 https://www.jianshu.com/p/5a6fd7fdaf4f

token已经放到authorization了还是不行的原因是无法按照规则生成token。本地登录时，没有携带token，直接跳转了。线上访问时，携带token，但是是无效的，就给你了个提示。这种情况，需要有前端逻辑来控制跳转。

解决token无效的方法：

1、需要授权的API，必须在请求头中使用Authorization字段提供token令牌。

2、用户授予第三方应用访问该用户某些资源的权限，在安装手机应用的时候，APP会询问是否允许授予权限访问相册、地理位置等权限。

3、在访问微信小程序时，当登录时，小程序会询问是否允许授予权限获取昵称、头像、地区、性别等个人信息。实现授权的方式有：cookie、session、token、OAuth。

4、需要在main.js文件里添加axios拦截器然后在请求头中可以发现Authorization的值还是Null,原因就是当你发送的发出的是登录请求，在登录期间服务器没有给你token，如果登录之后调用其他接口再去监听这次请求的话就会发现Authorization的值不再是null了，而是登录后的token。

5、根据授权Authorization的解释，之所以要这么做的原因就是要给token授权访问api接口的权限。

以上内容参考：百度百科-Token

uni-app 进行小程序开发时，更改了相应的参数后，是需要进行重新编译，才能反馈在页面同中的，然后一旦重新编译的话，默认情况下后跳转到首页，也就是在pages.json中pages数组中的第一项。

对此uni-app是提供了有了condition https://uniapp.dcloud.io/collocation/pages.html#condition ，它是在pages.json中进行手动配置，更在于传入到页面的参数是并不容易拿到的。

因此希望可以通过某种方式可以最终达到，重新编译页面后，页面依旧可以停留在原先的页面，并且数据参数都是要与原来保持一致。

如果我能进行uni-app中的路由拦截，并将拦截到的路由设置在storage中，编译后，再次进入到首页时，使用navigateTo直接跳转到原来的页面，一切便大功造成。

对于uni-app中的路由拦截可以使用官方的拦截器， https://uniapp.dcloud.io/api/interceptor.html#addinterceptor 。 也可以采用重写路由的方式，如下：

问题在于,我们使用的原生的顶部栏，返回上一页，并不能被拦截到。而在微信小程序中，事件onBackPress是不起作用的。

因此这种方式不能很好的解决。 https://uniapp.dcloud.io/tutorial/page.html#lifecycle

基本的思路是在页面或者应用的销毁的销毁的生命周期时将当前页面的信息存储到storage，然后在页面加载时，跳转到原先的页面。

最终很遗憾的是，再次编译时是没有进入到 页面生命周期 onUnLoad中，也没有进入到组件生命周期 beforeDestory中的。

在开发环境中使用定时器，不断将当前页面的值写入到Storage中，编译再次进入时跳转。

通过了这种方式，特别对于层级很深的页面，不需要再编译之后一层层去点到之前的页面了，开发效率被大大提升。

---