渐进式框架
可以将VUE作为你的应用嵌入到你的项目。你可以只用我的一部分，而不是用了我这一点就必须用我的所有部分。是个一点一点的过程.声明式变成
VUE特点
可复用的组件
状态管理
虚拟DOM
解耦视图和数据
路由计时
VUE MVVM
M 模板 数据
V 视图 dom
ViewModel 视图模型 View和Model通信的桥梁 一方面实现了Data Binding就是数据绑定，将Model的改变反应到View中。另一方面实现了Dom Listener就是数据监听。当Dom发生一些事件（点击、滚动等）时，可以监听到，并在需要的情况下改变对应的Data
{{}}
Mustache语法
创建VUE时，options可以放哪些东西
el
data
methods
生命周期函数
vue 插值语法
<h2 v-once>{{name}}</h2>
<h2 v-html = 'htmls'></h2>
<h2 v-text = 'text'></h2>
<h2 v-pre>{{pre}}</h2>
<h2 v-cloak>{{cloak}}</h2>
<img v-bind:src="url" alt=""> 可以写数组语法 对象语法
计算属性
computed 创建vue实例 set get 有缓存
es6
字面量
修饰符
stop 阻止冒泡
prevent 阻止默认事件
once 触发一次
哪些可以响应式
pop（删除最后一位）
v-model原理
v-on:input + :value
lazy修饰符
不实时修改数据。可以在enter或者光标离开时操作
安装eslint
在新建的项目中找到node_modules\.bin\eslint --init
有三个选择。第一个选择相对没有校验 第二个通用校验 第三个比较严格
组件化
父子组件通信
通过props向子组件传递数据
通过事件向父组件发送消息
通过emit向父组件传递数据
组件中data为什么是函数
watch和compoted区别
父子组件的访问方式
$childeren
this.$children[3].test() 得到对应的子组件
$refs reference缩写
在组件上绑定个ref
子父组件的访问方式
$parent
在子组件this.$parent.typeName 但是不建议使用 复用性不强
插槽slot
原有组件更具有扩展性。让使用者可以决定组件内部的一些内容到底可以展示什么
抽取共性，保留不同
一旦预留了插槽就可以让使用者根据自己的需求，决定插槽插入什么内容
默认插槽：<slot></slot>
具名插槽
给插槽命名 eg:<slot name="left">就代表左边的插槽</slot>
作用域插槽
编译作用域：父组件引用的变量只能在父组件使用，如果子组件有相同名称使用不了，反之子组件也同理
父组件替换插槽的标签。但是内容由子组件来提供
常用模块化规范
CommonJS、AMD、CMD、ES6的Modules
模块化的核心就是导出、导入
CommonJS
module.exports = {
}
对象之后被定义的所有属性都会被导出
导入就是用require
ES6 Modules
export导出/import导入
export和export default区别
某些情况下，一个模块中包含某个功能，我们并不希望给这个功能命名，而且让导入者可以自己来命名 这个时候就需要用到export dafault
VUEX
mutations
只有matations才能改变state数据
方式一 $store.commit( )也可以在页面直接声明
方式二 import {mapMutations} from 'vuex'
methods:{...mapMutations(['方法名','方法名二'])}直接通过this.方法名
actions
用于处理异步任务
如果通过异步操作变更数据，必须通过Actions，不能使用mutations，但是在Actions中还是要通过触发Mutations的方式间接变更数据
actions：{
方法名(content，参数){
操作
content.commit('mutations中的方法名'，参数)
}
}
方式一 在.vue中使用this.$store.dispatch('方法名'，参数)触发函数
方式二 在.vue中导入函数import {...mapActions} from 'vuex'
methods:{...mapAction(['方法名','方法名二'])}直接通过this.方法名
Getters
用于对Store中的数据进行加工处理形成新的数据。getters不会修改原数据。Store中数据发生变化，Getters的数据也会跟着变化
getters:{
num(state){
rreturn '新值'+state.count+''
}
}
方式一 this.$store.getters.num
方式二 在.vue中导入函数import {...mapGetters} from 'vuex'
methods:{...mapAction(['方法名','方法名二'])}直接通过this.num
Webpack
