MpVue是什么
基于 Vue.js 的小程序开发框架
从底层支持 Vue.js 语法和构建工具体系。
使用vue开发小程序 修改了 Vue.js 的 runtime 和 compiler 实现，使其可以运行在小程序环境中 使用vue语法开发，编译为小程序语法 一套vue程序h5+小程序 Vue组件规范，熟悉vuejs即可开发小程序 比wepy工具对vue语法支持度更高
小程序的缺点
语法和html css不兼容，单独开发
学习成本
MpVue的能力
彻底的Vue组件化开发能力：提高代码复用性 完整的vue开发体验 彻底的Vue组件化开发能力：提高代码复用性 快捷的 webpack 构建机制：开发阶段 hotReload 支持npm安装依赖 使用 Vue.js 命令行工具 vue-cli 快速初始化项目 H5 代码转换编译成小程序目标代码的能力
MpVue入门
# 1. 先检查下 Node.js 是否安装成功 $ node -v v8.9.0 $ npm -v 5.6.0 # 2. 由于众所周知的原因，可以考虑切换源为 taobao 源 $ npm set registry https://registry.npm.taobao.org/ # 3. 全局安装 vue-cli # 一般是要 sudo 权限的 $ npm install --global vue-cli@2.9 # 4. 创建一个基于 mpvue-quickstart 模板的新项目 # 新手一路回车选择默认就可以了 $ vue init mpvue/mpvue-quickstart my-project # 5. 安装依赖，走你 $ cd my-project $ npm install $ npm run dev
MpVue目录结构与讲解
Vue生命周期+兼容小程序生命周期
Created 创建初始化
有一些vue不支持的就必须结合小程序自带的API
例如 onPullDownRefresh
模板语法
动态style和class 使用计算属性返回字符串 V-if和v-for用法不变 表单v-model全支持
事件处理
bind换成@ 使用vue的绑定语法
模板
除了动态渲染，别的都支持 （v-html）
.vue单文件组件
小程序自带组件也可以用
自带组件事件绑定也使用vue的，比如@click