Vue知识点总结-2

1.vue中v-if和v-show的区别
　　v-if和v-show都是用来控制元素的渲染
　　v-if是根据后面数据的真假，来判断DOM的添加删除等操作
　　v-show只是在修改元素的css样式（display属性值）
　　v-if如果初始渲染条件为真，就渲染，反之就不渲染
　　v-show不管初始条件是否为真，都会被渲染
　　v-if有更高的切换消耗，不适合做频繁的切换
　　 v-show有更高的初始渲染消耗，适合做频繁的切换

2.v-if和v-for的优先级
答：当 v-if 与 v-for 一起使用时，v-for 具有比 v-if 更高的优先级，这意味着 v-if 将分别重复运行于每个 v-for 循环中。所以，不推荐v-if和v-for同时使用。
如果v-if和v-for一起用的话，vue中的的会自动提示v-if应该放到外层去

3.vue的几种常用指令
v-if、v-show、v-for、v-on、v-bind、v-model、v-once

4.v-on可以绑定多个方法

5.vue中$mount与el区别
$mount和el两者在使用中没有什么区别，都是将实例化后的vue挂载到指定的DOM元素中如果在实例化vue时指定el，则该vue将会渲染在el对应的DOM中没有指定el，则vue实例会处于一种“未挂载”的状态，此时通过$mount来手动执行挂载

6.vue中key值和is的作用
使用key，vue会基于key的变化重新排列元素顺序，并且移除key不存在的元素。可以做优化处理
is可以扩展原生html元素，也可以绑定动态组件

7.组件中data为什么是函数
　　因为组件是用来复用的，JS 里对象是引用关系，这样作用域没有隔离
　　而 new Vue 的实例，是不会被复用的，因此不存在引用对象的问题

解释：因为JavaScript的特性所导致，在component中，data必须以函数的形式存在，不可以是对象。
　　组建中的data写成一个函数，数据以函数返回值的形式定义，这样每次复用组件的时候，都会返回一份新的data，相当于每个组件实例都有自己私有的数据空间，它们只负责各自维护的数据，不会造成混乱。而单纯的写成对象形式，就是所有的组件实例共用了一个data，这样改一个全都改了。

8.Vue通信
第一种：props和$emit第二种：中央事件总线EventBus(基本不用)第三种：vuex（状态管理器）第四种：$parent 和 $children
当然还有其他办法，但是基本不常用

9.vue有哪些修饰符(不常见的)
　　事件修饰符：stop、prevent、self、once
　　键盘修饰符：enter、space、up、down
　　表单修饰符修饰符：number、trim、lazy
.stop：等同于JavaScript中的event.stopPropagation()，防止事件冒泡；
.prevent：等同于JavaScript中的event.preventDefault()，防止执行预设的行为（如果事件可取消，则取消该事件，而不停止事件的进一步传播）；
.capture：与事件冒泡的方向相反，事件捕获由外到内；
.self：只会触发自己范围内的事件，不包含子元素；
.once：只会触发一次。
请分别说出vue修饰符trim、number、lazy的作用
　　trim:用来过滤前后的空格
　　number:将用户输入的数据绑定为number类型
　　lazy:使用了这个修饰符将会从“input事件”变成change事件进行同步

10.说一下vue组件之间的传递

1. 父级传递子级：
   　　首先在子组件上加一个v-bind:自定义属性,等于父级的数据，子组件通过props方法接收数据
2. 子级传递父级：
   　　在子组件上绑定一个自定义事件，并且传入父级的“事件”处理函数
   　　在子组件内部使用$emit监听这个自定义事件，this.$emit(‘自定义事件名’,参数)