簡單介紹一下什麼叫做插槽?安放乙個插槽(預留線盒)插槽就像是在房屋裝修的時候安放的預留線盒,他什麼都不幹就是這個位置,當有需要的時候就會被其他的插座,替換這就是它的使命.
插槽也一樣,他也是占個位置,等待被其他的標籤,元件替換掉.
使用其他的元件或是標籤替換插槽vue.component("parent",)
顯示結果:因為沒有對第乙個slot進行取名,所以他會用被其他slot使用的剩餘內容標籤替換自身,第二個h1標籤中的
slot="main"的意思是這個插槽替換name="main"的插槽,第三個標籤我們並沒有對他進行賦予內容,因為他有自己的值所以在沒有賦予內容的情況下他會顯示自己的資訊
修改演示我們可以見到不論預設插槽(沒有其名字的slot)會使用被其他slot使用的剩餘內容或是標籤替換自身
在這次demo演示中我們見到了幾個新的api和標籤template,v-slotVue基礎語法
指令 1.1 資料繫結指令 v pre 填充原始資訊 1.顯示原始資訊跳過編譯過程 v once 只編譯一次 應用場景 顯示的資訊後續不需要修改。1.2 雙向資料繫結type text v model username 1.3 事件繫結type button v on click num type ...
Vue 基礎語法
lang en charset utf 8 模板語法 v指令入門title src script head root div div div v html test2 my.age div div 物件，裡面有兩個最基本屬性，是固定屬性 要寫在 id 為 root 的 div 下面 const co...
Vue基礎語法
常用控制項 基本練習 class繫結 使用方式 v bind class expression expression的型別 字串 陣列 物件 style繫結 v bind style expression expression的型別 字串 陣列 物件 vue通過由點 表示的指令字尾來呼叫修飾符，st...