本文已参与「新人创作礼」活动，一起开启掘金创作之路。
这里总要是对微信小程序的基础知识点做了一些总结，让初学者有更直观的感受，同时也简单就微信小程序和vue语法的区别做了对比！
1、配置小程序
小程序全局配置和页面配置（项目运行基础）
2、生命周期
- VUE（8个）
- beforeCreate 实例组件刚创建，元素DOM和数据都还没有初始化；
- created 数据data已经初始化完成，方法也已经可以调用，但是DOM未渲染；
- beforeMount DOM未完成挂载，数据也初始化完成；
- mounted 数据和DOM都完成挂载，在上一个周期占位的数据把值给渲染进去；
- beforeUpdate 只要是页面数据改变了都会触发，数据更新之前，页面数据还是原来的数据，当你请求赋值一个数据的时候会执行这个周期，如果没有数据改变不执行；
- updated 页面数据改变了都会触发，数据更新完毕，页面的数据是更新完成的；
- beforeDestroy 组件销毁之前执行（当前组件关闭切换到其他组件）；
- destroyed 组件销毁；
- activated 被 keep-alive缓存的组件激活时调用；
- deactivated 被 keep-alive缓存的组件停用时调用；
- 小程序（5个）
- onLoad 页面加载 --- 一个页面只会调用一次，可以再onLoad中获取打开当前页面所调用的query参数；
- onShow 页面显示 --- 每次打开页面都会调用一次；
- onReady 页面初次渲染完成 --- 一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互；对界面的设置如 wx.setNavigationBarTitle 请在onReady之后设置；
- onHide 页面隐藏 --- 当navigateTo 或底部tab切换时调用；
- onUnload 页面卸载 --- 当redirectTo或navigateBack的时候调用；
- 数据请求
在页面加载请求数据时，两者钩子的使用有些类似，vue一般会在created或者mounted中请求数据，而在小程序，会在onLoad或者onShow中请求数据。
3、用法区别
- 数据绑定
2. 列表渲染
- vue
- 小程序
-
显示与隐藏
vue中，使用v-if 和v-show
小程序中，使用wx-if和hidden
-
事件处理
- vue中，使用v-on:event绑定事件，或者使用@event绑定事件
- 小程序中，全用bindtap(bind+event)，或者catchtap(catch+event)绑定事件
如bindclick 、bindinput、bindchange等
- 数据双向绑定
- 设置值
- vue（通过v-model，然后绑定data中对应的值）
- 小程序（通过this.setData({key:value})来将表单上的值赋值给data中的对应值）
- 取值 vue，通过this.reason 取值
小程序，通过this.data.reason取值
- 绑定事件传参 vue中，在触发事件的方法中，把需要传递的数据作为形参传入就可以了；
小程序中，需要将参数作为属性值，绑定到元素上的data-属性上，然后在方法中，通过e.currentTarget.dataset.*的方式获取
4、WXML语法（模板、引用）
- 模板
WXML提供模板（template），可以在模板中定义代码片段，然后在不同的地方调用。
模板拥有自己的作用域，只能使用data传入的数据以及模板定义文件中定义的模块
- 定义模板 使用name属性，作为模板的名字，然后在 template 内定义代码片段：
- 使用模板 使用is属性，声明需要的使用的模板，然后将，模板所需要的data传入：
is属性可以使用Mustache语法，来动态决定具体需要渲染哪个模板：
- 引用
WXML提供两种文件引用方式import 和 include。
- import
在item.wxml中定义了一个叫item的template：
在index.wxml中引用了item.wxml，就可以使用item模板：
- include
include可以将目标文件除了template 、 wxs 外的整个diamante引入，相当于拷贝到include位置。
