微擎项目适配转换uni-app项目私活经验分享

  1. 微擎项目在市场上广受欢迎,功能丰富,因此很多人想要将其转化为uni-app项目,以实现多平台运行的能力。
  2. 在转换过程中,我们确实遇到了不少挑战,但得益于uni-app平台强大的基础能力支持,我们最终都成功解决了这些问题。
  3. 下面我将分享我们在适配转换过程中的一些思路和经验,希望能对大家有所帮助。

代码结构迁移步骤

  • 我们以适配一个名称为“type”的页面,进行全面讲解

  • 微信小程序页面:type.js type.json type.wxss type.wxml

  • uniapp页面:只需要新建一个页面type.vue,目录层级和小程序保持一致即可。新建页面后,页面中会有三部分template,script,style,系统会自动生成这三部分。

  • 页面映射关系如下
    在这里插入图片描述

  • 页面迁移结束后,就是进行标签的替换了,小程序的一些标签在uni-app是不识别的,但是整体还是比较简单的,参照下面的表格进行替换就可以了
    在这里插入图片描述

  • 按照上面的标签替换方案替换完成后,页面基本上就可以进行展示了,再进行页面细节的调试,一个页面基本上就可以出来了,大概平均调试一个页面30分钟左右(根据页面复杂程度定)

迁移过程中遇到的一些“坑”,一起共勉

  • 取页面data值时由“this.data” 改成 “this._data”(备注:具体原因未知,期望知道的大佬讲解下,不胜感激,当初排查这个问题足足花费了3天左右的时间才定位到这个问题)
  • uniapp要求所有data变量提前定义,而微信小程序没有此要求,这块容易出问题。

经典文章分享

  • 10
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值