最近加入了一个小程序原生开发我的项目，尽管有好几年没写过小程序了，但还是记得那么一点。

不过也只是记得有点印象而已，当初再写还是得再好好看看文档，所以那些坑点还是趟了不少。

既然有坑那就来吐槽，不，来记录一番吧～

布局时宽高用百分比不失效问题

这个问题，用 vw 或 vh 代替就能解决

Page 里援用了 自定义组件，导致页面底部有大量空白区域

这是一个奇葩问题，网上也没找到好的方法，刚开始认为会要卡不少工夫，起初无心中发现在外层容器上加一个 overflow: hidden; 能解决这个问题，amazing!
这里最好再加一个最小高度：

.wrapper {  min-height: 100vh;  overflow: hidden;  padding-bottom: xxpx;}

同级或跨多级组件与组件（或页面）之间数据通信

对于简单的页面，比方有几个tab页须要切换，有很多自定义组件须要互相通信，在没有状态治理是很苦楚的。
官网有一个页面与页面之间通信的事件 EventChannel，这个藏的挺深的，至多我没找到，用搜寻也没找到，官网API写的真是一言难尽，刚看这个API时还认为能解决我的须要，但它又没写分明具体场景，而后网上找其余文章才发现只是页面之间的事件通信，不满足我的需要。
而后只好网上找了个简略的订阅公布治理事件改了改，发现还是挺好用的。

// app.jsApp({  addListener: function (pageName, callback) {    if (!('fn' in this)) {      this.fn = {}    }    this.fn[pageName] = callback  },  setChangedData: function (pageName, data) {    if (this.fn && pageName in this.fn) {      this.fn[pageName](data)    }  }})const app = getApp()const PageName1 = 'page1'const EventType1 = 'eventType1'// 订阅, onLoad 或者 ready 里onLoad: onLoad: function () {    const self = this    app.addListener(PageName1, function (data) {      if (data.type === EventType1) {        self.dosomething(data)      }    }}// 公布app.setChangedData(PageName1, {  type: EventType1,  data1: 'xxx',  data2: 'xxx',  ...})

其余

  • 小程序开发工具清理缓存在非凡状况下不好使，比方合了其余分支，须要删除dist再从新生成时，缓存清不掉，开发工具报错会始终提醒，这时候须要重启一下开发工具了
  • 官网API 看上去整洁有序，实际上想要的都不好找，间接用搜寻的好，但常常搜不到想要的。
  • 有自定义组件时，如果不在根目录里app.json 里把自定义组件门路加上去，真机调试时有时会通不过，但起初删掉了又没事了，不晓得其他人是不是配置了啥，迷！