miniprogram-to-uniapp-master 小程序代码转换成uniapp代码笔记

公司一个项目,需要开发一个和小程序一样的APP。功能不多懒得自己写。废话不多说,上正题。

准备工作

开发工具 HBuilder X
转换工具源码 miniprogram-to-uniapp(附上作者的使用指南)
小程序代码一份

解压下载好的miniprogram-to-uniapp,打开文件夹然后打开命令窗口,运行【 npm install miniprogram-to-uniapp -g 】进行安装,因为这个包是工具,要求全局都能使用,所以需要-g进行全局安装。
如果运行npm报错,请先安装Node.js
在这里插入图片描述
继续在命令行里,运行【 wtu -V 】,如果有显示版本号码说明已经安装成功了。
在这里插入图片描述
在命令行里,输入【wtu -i “你的小程序项目路径” -o “输出目录,可不填”】,如:【wtu -i “E:\zpWork\Project_self\miniprogram-to-uniapp\test\test-wx-to-uni”】 ,回车后即可以在源项目同及目录得到一个后缀为_uni的目录,即转换成功。
在这里插入图片描述
这样就转换成功了~!!但是。。还没完,工具毕竟只是一个辅助的。我们还要修改一些东西
用HBuilderX打开这个项目里面有个转换日志的文件 transform_log.log
在这里插入图片描述
然后开始修改我们的代码。我这边主要只遇到两个问题。
一个是图片路径需要自己在去改一下。

//小程序的图片路径是
<image src="/images/1.png"></image>


//uniapp的图片路径是
<image src="../static/images/1.png"></image>

还有一个就是路径传值页面获取的问题了。

//小程序获取路径传值
onLoad: function(options) {
    this.setData({
      id: options.id
    });
}

//uniapp获取路径传值
onLoad: function(options) {
      this.id = options.id
}

uniapp在onload的生命周期中好像是不支持this.setData的,使用setData赋值的话就会变成undefined。

因为项目简单就只改这样。可能还会有其他的问题暂未发现。

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值