通過插槽可以更方便得向子元件新增dom元素
dell
vue.component('child',);
複製**
顯示就是父元件向子元件新增得dell
也可以給定義預設值,當父元件沒有給子元件新增插槽時顯示。
預設內容
複製**
具名插槽
"header" slot="header">header
"footer" slot="footer">footer
vue.component('body-content',);
複製**
通過具名插槽這種寫法,可以一次性傳遞多個區域的dom結構(給每一插槽傳遞的內容區域傳遞乙個 slot=」「),在子元件裡通過具名插槽分別使用幾個部分的dom結構。
作用域插槽:當子元件做迴圈或者某一部分應該由外部傳遞進來的時候
首先父元件呼叫子元件的時候,給子元件傳遞乙個插槽,這個插槽叫做作用域插槽,作用域插槽必須是乙個開頭和結尾的內容, 同時這個插槽要宣告乙個slot-scope 來接受子元件傳遞過來的資料,然後提供乙個模板資訊顯示資料如何展示。
"props">
}--------hello
vue.component('child',
},template: `
` });
複製**
Vue學習小札 2 4 父子元件間的資料傳遞
父元件向子元件傳遞資料 父元件通過屬性的形式向子元件傳遞資料 子元件通過props形式接受父元件傳來的資料。0 1 複製 父元件通過屬性的形式向counter子元件傳遞了乙個叫count的資料,子元件通過props接受count這個屬性的內容。這樣在子元件的模板裡面就可以直接來使用count。單向資...
在Vue中使用Sass
sass 是什麼?sass又稱scss,它是css預處理之一。它在css語法的基礎上增加了變數 巢狀 混合巨集 繼承 佔位符等等高階功能。那什麼是css預處理器呢?簡單理解就是,css預處理是一種專門的程式語言,通過該語言進行web頁面設計,然後再編譯成正常的css檔案,以供專案使用。css預處理器...
在vue中使用wowjs
1 安裝依賴 npm install wowjs s 2 main.js中引入 引入animate.css,安裝wowjs之後,直接引入 import animate.css 3 在需要使用wowjs的元件中使用 在標籤上新增動畫的類名 data wow duration 動畫持續時間 data w...