使用mpvue开发小程序的坑和经验

历经了接近两个月的痛苦煎熬,我主导开发的第一个小程序终于要上线了!总结一下~


gh_f1e2f7f1f692_258.jpg

框架的选择

原生的小程序语法我只停留在看API阶段,由于公司H5的项目是基于VUE的,所以当MPVUE出来后就一直关注,最终选择了使用它来开发。

项目的搭建

跟着mpvue的官方文档,一步步走就OK

踩到的坑

1 tabBar图标问题

在 配置小程序原生的底部tabBar 时,遇到了第一个问题:在将设计师给我的图标icon路径设置正确的情况下, 开发者工具上的tabBar的图标总是会很大,而且几乎占满了整个高度 ,相当难看
解决办法: 就是icon尺寸保持不变,然后四周留出合适的透明空白

2.多页面共用一个page导致的一系列问题

https://github.com/Meituan-Dianping/mpvue/issues/140
https://github.com/Meituan-Dianping/mpvue/issues/300
mpvue github上此类问题简直多不可数,根本原因就是多个页面共用一个小程序页面导致生命周期混乱
解决办法 :https://github.com/HelloZJW/mpvue-page-factory 目前找到的最优解决办法

3.数据更新DIFF问题

此问题官方最新版本貌似已经进行了一部分优化,但是我自己的项目使用还是有点问题 ,目前还是在使用社区提供的一套diff算法 https://github.com/Meituan-Dianping/mpvue/issues/639

4.created钩子函数在项目初始化时就全部执行的问题

解决办法 :不要用created钩子函数

Flyio的使用

在小程序的开发中,并没有使用小程序原生的wx.request()来进行数据交互,而是选择了mpvue文档里推荐使用的Flyio,Flyio的介绍就不多做介绍,可以自己看文档。

最近发下uni-app 不错,尝试迁移了一下发下完美兼容。打包了下APP使用体验也很不错

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • #1 控制<webview>中弹出的窗口 需要监听一个<webview>的弹窗事件时,有两种方法: 和 第一种更简...
    平仄_pingze阅读 20,816评论 7 4
  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 8,152评论 1 4
  • 清晨 露珠栖于草叶 蝴蝶飞上心尖 蜀葵的花 刺向天空 一节节 缀满幻想 乳燕低飞 修剪雨水的气息 广玉兰的花香 搅...
    听雪1014阅读 1,792评论 2 0
  • 五年前的夏天,他第一次遇见何施。 那天是在校车上,他急急的赶上车,站在车厢里寻找座位的时候,何施正坐在窗边,出神的...
    段家橘子阅读 3,262评论 0 3
  • 名人的自传、访谈往往会有夸大或者隐藏重点的倾向,所以经常作为大家的谈资,却不会引发共鸣。但上面汤先生的这句话,我是...
    红薯大人和芝士少女阅读 1,661评论 0 0

友情链接更多精彩内容