1.Vue的两个核心：
数据驱动、组件系统
数据驱动：ViewModel，保证数据和视图的一致性。
组件系统：应用类UI可以看作全部是由组件树构成的。
2.在vue中is的使用场景：
改变html标签的默认规则，比如ul里放li，dl里放dt等，
动态切换组件：
<component v-bind:is="currentView"></component>
特殊嵌套：
<table>
<tr is="my-row"></tr>
</table>
3.常用指令及常用事件修饰符
 |
 |
4.v-if和v-show的区别：
v-show通过控制display：none，v-if通过删除节点。
频繁操作元素显示隐藏使用v-show
v-show和v-if都可以控制元素的显示与隐藏。
5.渐进式框架
主张最少 框架分层
最核心的是视图层渲染，然后往外是组件机制，在此基础上再加入路由机制，再加入状态管理，最外层是构建工具
Vue最核心的功能之一，类似自定义标签，但是它具有独立的HTML+JS，独立的数据管理
组件的优势：重用性比较高、自由组合
组件是可复用的Vue实例,如果网页中的某一个部分需要在多个场景中使用，那么我们可以将其抽出为一个组件进行复用。组件大大提高了代码的复用率。
全局方式
直接使用Vue.component()创建的组件，所有的Vue实例都可以使用。
局部方式
三部曲1.创建这个组件；2.注册这个组件；3.使用这个组件
一个具有独立的逻辑和功能或界面，同时又能根据规定的接口规则进行相互融合，变成一个完整的应用页面只不过是这些组件的容器，组件自由组合形成功能完善的界面，当不需要某个组件，或者想要替换某个组件时，可以随时进行替换和删除，而不影响整个应用的运行。
10.组件中data为什么不是一个对象而是一个函数
组件中的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。而单纯的写成对象形式，就使得所有组件实例共用了一份data，就会造成一个变了全都会变的结果。
11.深度监听
<body>
<div id="app">
{{address.province}} - {{address.city}} - {{address.area}}
{{skills}}
</div>
</body>
<script src="vue.js"></script>
<script>
var vm = new Vue({
el:"#app",
data:{
address:{province:‘贵州省‘,city:‘遵义市‘,area:‘汇川区‘},
skills:[‘吃饭‘,‘做饭‘,‘拖地‘]
},
watch:{
address:{
deep:true,
handler(newValue){
console.log(newValue);
}
},
skills:{
deep:true,
handler(newValue){
console.log(newValue);
}
}
}
})
</script>
watch:{
myObj:{
handler(newValue, oldValue) {
//执行操作
},
deep: true
}
}
计算属性与普通data中的属性区别在于，计算属性可以通过一些运算逻辑返回属性值， 函数会在相关属性值变化时自动执行，也就是说计算属性也是动态绑定的。场景：主要是对data里面的数据进行过滤，往往过滤的过程中不应该影响原始数据
computed特性
watch特性
15.父子组件如何传值
父：<son :msg="msg"></son>
子：props: [‘msg‘]
子：this.$emit(‘fun‘, 参数)
父：<son @fun="fun"></son>
总结：父组件通过 prop 给子组件下发数据，子组件通过$emit触发事件给父组件发送消息非父子关系的通过创建一个新的Vue实例，用于数据传递通过$on()绑定一个自定义事件、通过$emit()去触发这个事件并传参
16.生命周期
把Model和View关联起来的就是ViewModel。ViewModel负责把Model的数据同步到View显示出来，还负责把View的修改同步回Model
20.动态绑定class的方法
对象方法：
:class="{ ‘active‘: isActive }"
:class="{‘active‘:isActive==-1}"
或者
:class="{‘active‘:isActive==index}"
绑定并判断多个
:class="{ ‘active‘: isActive, ‘sort‘: isSort }"
第二种（放在data里面）
:class="classObject"
data() {
return {
classObject:{ active: true, sort:false }
}
}
数组方法
:class="[isActive,isSort]"
data() {
return{
isActive:‘active‘,
isSort:‘sort‘
}
}
:class="[isActive?‘active‘:‘‘]"
:class="[isActive==1?‘active‘:‘‘]"
原文：https://www.cnblogs.com/Allensangel/p/12245758.html