vue 2.6 插槽更新v-slot 用法总结- SegmentFault 思否
文章推薦指數: 80 %
在2.6.0 中,我们为具名插槽和作用域插槽引入了一个新的统一的语法(即v-slot 指令)。
它取代了slot 和slot-scope 这两个目前已被废弃但未被移除且 ...
引vue官方文档之前做项目时,对插槽理解太少了,这两天学习时,才发现插槽更新用v-slot了,自己做了些简单总结,与大家分享一下~我的理解就是父页面在组件标签内插入任意内容,子组件内插糟slot控制摆放位置(匿名插槽,具名插槽)插槽一共就三大类1.匿名插槽(也叫默认插槽): 没有命名,有且只有一个2.具名插槽: 相对匿名插槽组件slot标签带name命名的3.
延伸文章資訊
- 1[Vue] Slot 是什麼? 怎麼用?. 在component中預留空間slot,在父 ...
<template v-slot:header>我要指定name是header的slot內容</template> <template> ... 自2.6.0 版本之後,slot-scope 的...
- 2vue 2.6 插槽更新v-slot 用法总结- SegmentFault 思否
在2.6.0 中,我们为具名插槽和作用域插槽引入了一个新的统一的语法(即v-slot 指令)。它取代了slot 和slot-scope 这两个目前已被废弃但未被移除且 ...
- 3v-slot的用法(代替slot和slot-scope)_超级无敌前端小菜鸡的博客 ...
v-slot的用法(去除了slot和slot-scope)具名插槽根组件<div id="app"> <Son> <template v-slot:name><!-- 这里注意是v-slot:子...
- 4Vue.js: Slot | Summer。桑莫。夏天
Vue.component('app-child', { template: ` <div v-if="isShow"> <h1>我是子元件</h1> </div>`, data() { ret...
- 5一起幫忙解決難題,拯救IT 人的一天 - iT 邦幫忙 - iThome
在Vue 的Component 中還有個好用的東西叫做slot,當開發複雜或巢狀 ... <ul> <slot name="item" v-for="item in items" :text="...