-
v-if 和 v-show 的區(qū)別。
參考答案
- v-if 讓元素 出現(xiàn)/不出現(xiàn) 在頁面
v-show 元素 一直 在頁面中 添加style display:... - 當(dāng)v-if 為 true 的時(shí)候 元素 created
當(dāng)v-if 為 false 的時(shí)候 元素 destroy
v-show 只改style 不去觸發(fā) 生命周期的鉤子
-
依賴注入怎么使用
provide 選項(xiàng)應(yīng)該是一個(gè)對(duì)象 或 返回一個(gè)對(duì)象的函數(shù)
provide() {
return {
xxx: "yyy"
};
}
inject 選項(xiàng) 一個(gè)字符串?dāng)?shù)組 或 一個(gè)對(duì)象
inject: ["xxx"],
methods:{
a(){
this.xxx
}
}
-
mixins 怎么使用
示例組件
const xxx = {
name:"Loo",
data(){ return {a:''}},
mounted(){},
methods:{
foo(){}
}
}
export default xxx
mixins 選項(xiàng)接受一個(gè)混入對(duì)象的數(shù)組
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(){}
}
組件接受一個(gè) directives 的選項(xiàng)
import XXX from "xxx"
new Vue({
name:"Loo",
directives: {XXX},
methods:{}
})
使用
<template>
<div v-xxx>
</div>
</template>
-
$attrs
當(dāng)一個(gè)組件沒有聲明任何 prop, vm.$attrs會(huì)包含所有父作用域的綁定 (class 和 style 除外),并且可以通過 v-bind="$attrs" 傳入內(nèi)部組件