美团点评开源用 Vue.js 开发小程序的前端框架 mpvue

栏目: IT资讯 · 发布时间: 8年前

内容简介:美团点评近日开源了 mpvue ,这是一个使用 Vue.js 开发小程序的前端框架。使用此框架,开发者将得到完整的 Vue.js 开发体验,同时为 H5 和小程序提供了代码复用的能力。如果想将 H5 项目改造为小程序,或开发小...

美团点评近日开源了 mpvue ,这是一个使用 Vue.js 开发小程序的前端框架。使用此框架,开发者将得到完整的 Vue.js 开发体验,同时为 H5 和小程序提供了代码复用的能力。如果想将 H5 项目改造为小程序,或开发小程序后希望将其转换为 H5,mpvue 将是十分契合的一种解决方案。

mpvue 的核心目标是提高开发效率,增强开发体验。使用该框架,开发者只需初步了解小程序开发规范、熟悉 Vue.js 基本语法即可上手。框架提供了完整的 Vue.js 开发体验,开发者编写 Vue.js 代码,mpvue 将其解析转换为小程序并确保其正确运行。此外,框架还通过 vue-cli 工具向开发者提供 quick start 示例代码,开发者只需执行一条简单命令,即可获得可运行的项目。

主要特性:

  • 彻底的组件化开发能力:提高代码

  • 完整的 Vue.js 开发体验

  • 方便的 Vuex 数据管理方案:方便构建复杂应用

  • 快捷的 webpack 构建机制:自定义构建策略、开发阶段 hotReload

  • 支持使用 npm 外部依赖

  • 使用 Vue.js 命令行工具 vue-cli 快速初始化项目

  • H5 代码转换编译成小程序目标代码的能力

实现原理:

Vue代码

美团点评开源用 Vue.js 开发小程序的前端框架 mpvue

  • 将小程序页面编写为 Vue.js 实现

  • 以 Vue.js 开发规范实现父子组件关联

小程序代码

  • 以小程序开发规范编写视图层模板

  • 配置生命周期函数,关联数据更新调用

  • 将 Vue.js 数据映射为小程序数据模型

并在此基础上,附加如下机制

  • Vue.js 实例与小程序 Page 实例建立关联

  • 小程序和 Vue.js 生命周期建立映射关系,能在小程序生命周期中触发 Vue.js 生命周期

  • 小程序事件建立代理机制,在事件代理函数中触发与之对应的 Vue.js 组件事件响应

据悉,mpvue 框架已经在业务项目中得到实践和验证,目前正在美团点评内部大范围使用。mpvue 是基于 Vue.js 源码进行二次开发,在增加了小程序平台的实现同时,保留了跟随 Vue.js 版本升级的能力。


【声明】文章转载自:开源中国社区 [http://www.oschina.net]


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

数字民主的迷思

数字民主的迷思

[美] 马修·辛德曼 / 唐杰 / 中国政法大学出版社 / 2015-12-25 / CNY 39.00

马修·辛德曼著的《数字民主的迷思》主要讨论互联网对美国政治的影响,聚焦的是“民主化”这一课题。针对公众关于网络民主的美好想象与过分狂热,它通过对在线竞选、链接结构、流量模式、搜索引擎使用、博客与博主、内容生产的“规模经济”等主题的深入处理,借助大量数据图表与分析,勾勒出互联网政治的种种局限性。尤其表明,网络政治信息仍然为一小群精英与机构所创造和过滤,在网络的每一个层次和领域都仍然遵循着“赢家通吃”......一起来看看 《数字民主的迷思》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

XML 在线格式化
XML 在线格式化

在线 XML 格式化压缩工具

html转js在线工具
html转js在线工具

html转js在线工具