使用mpvue和wepy 开发小程序
【摘要】 mpvue 和 wepy 都是开发微信小程序的框架。都是牛人出口,给个赞!
wepy 是腾讯开源的一套语法接近vue.js、快速开发小程序的一套框架,开源的较早,网上有很多资源,也有一些大厂使用。并有成熟的UI,如weui 、zan-ui
mpvue 是美团开源的一套语法与vue.js一致的、快速开发小程序的前端框架,按官网说可以达到小程序与H5界面使用一套代码。最近刚刚开源,资料较少。
wepy 是腾讯开源的一套语法接近vue.js、快速开发小程序的一套框架,开源的较早,网上有很多资源,也有一些大厂使用。并有成熟的UI,如weui 、zan-ui
mpvue 是美团开源的一套语法与vue.js一致的、快速开发小程序的前端框架,按官网说可以达到小程序与H5界面使用一套代码。最近刚刚开源,资料较少。一些UI正在开发中。如 weui的mpvue实现。
最近做两个简单的小程序,第一个是用wepy + weui 实现的。功能比较简单。基于weui demo 改一改就可以跑起来个小程序了。
遇到的比较多问题就是不会使用Promise (本人是后端写Java的,感觉前端JS代码有点飘…..),后来总算是能跑起来了,也不知道是不是正确的写法。
|
|
上周看到mpvue的开源消息,下来试了一下,今天也算是跑一个功能简单的小程序。总体感觉比wepy要复杂,但语法是vue的语法(其实vue的语法我不知道多少)。下面对比一下我遇到这两个框架使用上不一样的地方:
值绑定
看代码:
|
|
|
|
mpvue中要使用v-bind:value的方式,并且取值要使用e.mp.detail.value.
wepy使用双花括号来绑定值,取值使用e.detail.value,这个比较接近原生小程序,因为是一家吗?
程序目录
mpvue 的目录结构要在pages目录下创建自己的目录,然后有两个文件。比如:pages/index/index.vue,pages/index/main.js, 在pages数组中配置页面是这样:’pages/index/index’,一个目录下只能使用一个页面,据大神说这是可以改的,但我还没有成功过。这点感觉没有wepy方便。
wepy 是在任何目录创建一个.wpy的文件,把css、html、script 都写在这个文件里,然后编译成小程序需要的三种格式的文件。比如:
pages/index.wpy ,在pages数组中配置页面是这样:’pages/index/‘,而且多个文件可以在同一个目录下。
配置
在小程序中对应的 data {}
|
|
|
|
对应 app.json的配置,mpvue 是在根目录(src)下的main.js,wepy是根目录下的app.wpy
总体来说,wepy更简单一些,mpvue显示要复杂一点
【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)