小程序

1、新项目开发的准备

1.1、官方文档的基础阅读
1.2、开发工具及开发环境的配置
1.3、选择合适的框架

2、开发过程中的代码整合

2.1、请求方式简单化
2.2、类似代码方法化
2.3、共用逻辑组件化

3、遇到问题怎么办

3.1、开发者社区
3.2、github上相关仓库的issue
3.3、......

4、一些关键点

让小程序支持服务端Session
主要就是要添加Cookie支持,可以包装一下wx.request方法实现
(1)解析response的Set-Cookie应答头,并将cookie保存在本地
(2)以后每次请求把本地保存的cookie放到Cookie请求头中
关键代码:

let __TOKEN__ = '';
const request = async (params = {}) => {
    const options = {
        url: params.url,
        method: params.method || 'GET',
        data: params.data || {},
        header: {
            'Content-Type': 'application/json',
            'Cookie': __TOKEN__,
        },
    }
    const res = await wepy.request(options);
    if (res.statusCode >= 200 && res.statusCode < 300) {
        if (params.withCookie && res.header['Set-Cookie']) {
            __TOKEN__ = res.header['Set-Cookie'];
            wx.setStorageSync('__TOKEN__', __TOKEN__);
        }
        return res.data;
    };
    return {
        XCode: res.statusCode,
        XMessage: res.errMsg,
    };
};

微信授权方案


小程序_第1张图片
image.png

分页及下拉刷新
关键代码:

enablePullDownRefresh: true,
onPullDownRefresh() {
  console.log('下拉刷新列表')
}
onReachBottom() {
  console.log('上拉加载下一页')
}
wx.stopPullDownRefresh(),

小程序更新

wx.getUpdateManager()

5、踩过的坑

  1. 基础库不同的兼容
  2. 自定义标题栏,分享的时候有的会将标题栏截取
  3. 支付成功后进入后台,不可调用reLaunch否则报错:fail can not invoke relaunch in background
  4. onShareAppMessage内不能调用异步方法
  5. 开发者工具看不到伪元素
  6. wx.getUserInfo()接口更改问题
  7. 文本换行
  8. 微信小程序区分分享到群和好友
  9. onLoad与onLaunch执行顺序问题
  10. 不要在循环组件里使用computed,会导致所有循环的组件计算的属性一样

6、一些建议

(1)button添加一个hover-class 是更好交互
(2)图片资源尽量减少本地使用,增加代码的容量

你可能感兴趣的:(小程序)