微信小程序开发从0到1【原生开发者工具开发】【2】

253 阅读2分钟

头像.png 一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第2天,点击查看活动详情

🍋欢迎关注 🍋[微信小程序开发从0到1] 🍋共同努力

一 、 前言

  1. tabBar的配置
  2. 分包的理解
  3. 小程序页面渲染setData
  4. 开发时遇到的问题

二、tabBar

tabBar无需手动配置,微信管阀提供的有它自己的方法,使用时只需按照它配置进行书写即可。tabBar最少2个最多5个。

jj-01.png

三、分包

3.1小程序以轻、小的形式出现它可以被便捷地获取和传播,同时具有出色的使用体验。所以小程序为包的管理有很大的限制。单个包2M代码包总大小20M

jj-02.png

3.2创建分包根据自己的喜欢 是都放在 pages文件里 还是单独拉出来 root 就是这个包的位置 默认是从创建的根目录下查找 有兴趣的小伙伴可以去看一下小程序示例(分包加载版)源码

jj-03.png

四、数据渲染

setData 的过程,大致可以分成几个阶段:

  • 逻辑层虚拟 DOM 树的遍历和更新,触发组件生命周期和 observer 等;
  • 将 data 从逻辑层传输到视图层;
  • 视图层虚拟 DOM 树的更新、真实 DOM 元素的更新并触发页面渲染更新。 setData 对对象的处理 对数组的处理 刚接触时可能会对这些赋值不明白
简单的 对象赋值   data:{obj:'name'}
this.setData({
    obj:'name1'
})
多层嵌套赋值 data:{obj:{obj1:'name'}}
this.setData({
    'obj.obj1':'name1'
})
简单的数组赋值  data:{obj:['这是一个数组']}
this.setData({
    obj:[1,2,3]
})
多层嵌套复杂时处理 data:{obj:[[0,1],[1,2]]}
    let num = 0
this.setData({
    [`obj[$num]`]:[1,2,3]
})

五 昨天发版上线出现了一个问题

IOS微信小程序真机wxs不执行 希望懂的大佬帮忙解惑 这是代码片段 developers.weixin.qq.com/s/4P7m1dmS7…