E企盈营销工具技术服务商 热线:4006-838-530

微信小程序wepy框架+minui踩坑之路

E企盈直播平台营销卖货系统

近期项目涉及微信小程序,鉴于原生小程序文件结构过于复杂,决定使用wepy框架开发wepy框架类似Vue的MVVM开发模式,并且支持promise与ES7 asnyc异步函数,记录一下项目开发过程中遇到的坑:1.minUI由于minUI与wepy框架兼容性较好,而且支持单组件导入,所以选择了minUI,使用方式官网有写,需要的组件直接npm安装即可,不过要注意的是,它的form组件对form表单提交支持性并不好,如果想要提交表单还是建议原生或者使用异步提交:minUI中的button组件并不支持disabled禁用(或者我没看懂文档,至少直接写disabled不行)。minUI中的很多组件样式是无法通过style或者class控制的,所以如果有需要,可以进入packages,找到组件的wxss自行添加。minUI可以和原生组件一起使用,例如原生scroll-view+minUI中的list。2.wepy 1.wepy的组件与父级css是共用的,也就是说主页面中的css组件也可以使用。 2.发送广播是向子组件传输数据的重要手段,而且子组件中的events可以当成子组件的生命周期函数使用(类似子组件的 onLoad)。 3.在组件中写生命周期其实是调用组件页面的生命周期,所以就像文档说的不需要写生命周期函数。 4.页面调用全局是this.globalData.*,组件调用全局变量是this.$parent.globalData.*,组件中的组件调this.$parent.$parent.*,此类推。 5.子组件所需要引入的UI组件/其他组件,都写在父级页面的usingComponents中,注意路径不要写错。6.由于第一次用,所以刚开始修改了dist文件导致项目崩溃(其实人也很崩溃),然后就是一个漫长的恢复项目的过程,重新cli等,但是发现还是不成功,显示页面构建失败之类的,刚开始发现忘了装async的pollyfill,npm后还是报错,最后查阅资料发现是babel的配置出了问题,于是乎修改了wepy.config.json:,再次编译如果显示UI组件找不到,路径正确的情况下可能是未开启微信小程序ide的ES6转ES5,最后再次build终于成功,所以请勿修改dist文件夹!7.不知道是不是build –watch的问题,在编译中添加文件后,删除/重命名文件都无效,只要被build进去的文件无法通过再次build删除(无奈),所以最后上传小程序时,我采用的方法是将dist文件单拎出来,对其中无效(被删除/重命名)的文件进行整理,最后记得整理app.json文件,最后进行上传即可。注:其中_wepylogs.js文件是用来记录错误的,在wepy编译中最后一次错误会被记录在这里,上传之前记得清除一下。3.Echarts这个参考一位大佬所写的方法:https://blog.csdn.net/juzipidemimi/article/details/81807110需要注意的是,我是将开源中的项目down下来直接复制了charts文件夹,其中每一个charts的组件中,存在一个initChart方法,它是用来代替原来的ec:{},原理在文章中有写,这个方法被写在了methods(){}中,如果你想通过后台数据实现动态刷新图表,可以使用ES7的async将你的request变为异步函数,最后在.then中进行initChart,否则如果请求的时间在initChart之后,图表是不会渲染出来的,因为数据没有请求到。例如:目前项目顺利开发完成,上传的dist目录结构:注:index.template.html不会被上传

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程序wepy框架+minui踩坑之路
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏