元件分類

vue元件主要包含：

1. 由vue-router產生的頁面，可以稱之為路由元件
2. 獨立基礎元件：例如Date和input這之類的可以全域性複用的基礎元件
3. 業務元件，除了以上兩種就是業務元件

元件精髓

props

• tppe 型別
• default 預設
  • 如果是物件，陣列，必須要寫成方法進行返回

msg:{
    type: Array,
    default: ()=>([])
}
複製程式碼

• validator 校驗，有一個引數value
• inheritAttrs 是否繼承html特性
• 子元件不能修改父元件傳遞過來的prop

event

方法一

<parent-com @on-click="handleClick"></parent-com>

子元件
<button>點選</button>
在子元件中觸發
this.$emit('on-click', event);
複製程式碼

方法二

加上.native就是原生方法
<parent-com @click.native="handleClick"></parent-com>

子元件
<button>點選</button>
複製程式碼

slot

<slot> 節點就是指定的一個插槽的位置,v-slot:[name]可以指定插槽的位置，有了name就叫具名插槽

元件通訊

1. ref：給元素或元件註冊引用資訊；
2. $parent / $children：訪問父 / 子例項。
3. props 父向子傳遞
4. $emit和$on,子----->父
5. vuex

第一節就是這些，不喜歡寫廢話