-
v-if 和 v-show 的区别。
参考答案
- v-if 让元素 出现/不出现 在页面
v-show 元素 一直 在页面中 添加style display:... - 当v-if 为 true 的时候 元素 created
当v-if 为 false 的时候 元素 destroy
v-show 只改style 不去触发 生命周期的钩子
-
依赖注入怎么使用
provide
选项应该是一个对象 或 返回一个对象的函数
provide() {
return {
xxx: "yyy"
};
}
inject
选项 一个字符串数组 或 一个对象
inject: ["xxx"],
methods:{
a(){
this.xxx
}
}
-
mixins 怎么使用
示例组件
const xxx = {
name:"Loo",
data(){ return {a:''}},
mounted(){},
methods:{
foo(){}
}
}
export default xxx
mixins
选项接受一个混入对象的数组
import XXX from "xxx";
new Vue({
name:"Loo1",
mounted() { console.log(2) },
mixins: [XXX]
})
-
自定义指令
export default {
inserted: function (el) {
el.focus()
},
bind:function(el,binding,vnode,oldVnode){
console.log(el,binding.value)
},
componentUpdated(){},
unbind(){}
}
组件接受一个 directives
的选项
import XXX from "xxx"
new Vue({
name:"Loo",
directives: {XXX},
methods:{}
})
使用
<template>
<div v-xxx>
</div>
</template>
-
$attrs
当一个组件没有声明任何 prop, vm.$attrs
会包含所有父作用域的绑定 (class
和 style
除外),并且可以通过 v-bind="$attrs"
传入内部组件