Vue 問答


  1. 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ā) 生命周期的鉤子

  1. 依賴注入怎么使用

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
    }
 }

  1. 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]
})

  1. 自定義指令

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>

  1. $attrs

當(dāng)一個(gè)組件沒有聲明任何 prop, vm.$attrs會(huì)包含所有父作用域的綁定 (classstyle 除外),并且可以通過 v-bind="$attrs" 傳入內(nèi)部組件

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容