vue知識點總結 --- slot 插槽
阿新 • • 發佈:2018-11-05
- 插槽
// 父元件 <div> <item> <span>666</span> </item> </div> // item子元件 <div> <slot></slot> </div> // 此時<span>標籤就會渲染在<slot>標籤的位置
-
具名插槽
// 父元件 <div> <item> <span slot="one">666</span> <span slot="two">777</span> </item> </div> // item子元件 <div> <slot name="one"></slot> <slot name="two"></slot> </div> // 此時<span>標籤就會分別渲染在對應name的<slot>標籤的位置
-
作用於插槽
// 父元件 <div> <item> <span slot-scope="props">{{props.value}}</span> </item> </div> // item子元件 <div> <slot value="666"></slot> </div> //