總結vue2.6統一了插槽的語法v-slot
在其他元件中使用child元件
hello world
child元件
上面是具名插槽的用法,省略插槽名:name屬性
或插槽名為default
表示匿名插槽
在其他元件中使用child元件
用法一:常規用法,slotprops
為自定義作用網域名稱
hello world
}
用法二:解構插槽prop,實際上就是es6解構json,可以使用:
替換引數名
hello world
}}
child元件,定義時將需要使用的作用域資料繫結在
即可,:user="user" :age="age"
v-slot:
vue2.6後插槽的用法簡單得了很多,也更加靈活,通過上面的示例可以看出,作用域插槽實際上就是在具名插槽的基礎上進行賦值。
v-slot:插槽名
v-slot:插槽名="作用網域名稱"
v-slot="作用網域名稱"
詳解vue2 6插槽更新v slot用法總結
插槽一共就三大類 1.匿名插槽 也叫預設插槽 沒有命名,有且只有乙個 2.具名插槽 相對匿名插槽元件slot標籤帶name命名的 3.作用域插槽 子元件內資料可以被父頁面拿到 解決了資料只能從父頁面傳遞給子元件 一 匿名插槽 也叫預設插槽default父頁面呼叫子元件 子v slot default...
Vue中v slot插槽的使用
在vue2.6.0以上版本v slot將取代slot scope和slot。這裡取代的意思是 v slot在呼叫時取代了 slot 和 slot scope,而在template中宣告時仍會用solt進行宣告插槽。匿名插槽 1.匿名插槽 template cpn1 div vue.component...
Vue中v slot的用法
記錄一下vue插槽的用法,以免忘記。包含預設插槽,具名插槽,作用域插槽的用法,預設插槽和具名插槽都可以是作用域插槽,本示例中三個都包含作用域。vue cli4.0.5 父元件test.vue test test for info in msg key info.firstname header da...