vue2中table插槽新语法 v-slot

v-slot = "{ row }"Vue 2.6+ 的新语法,官方推荐,更简洁、可读性更好。slot-scope="scope" 是老写法,功能等价,但写法啰嗦,未来会被淘汰。

示例对比:

bash 复制代码
<!-- 新语法 -->
<el-table-column v-slot="{ row }">
  <span :class="dayClass(row.mtkyts)">{{ row.mtkyts }}</span>
</el-table-column>

<!-- 老语法 -->
<el-table-column slot-scope="scope">
  <span :class="dayClass(scope.row.mtkyts)">{{ scope.row.mtkyts }}</span>
</el-table-column>
对比点 v-slot="{ row }"(新) slot-scope="scope"(旧)
Vue 版本 ≥ 2.6 所有 2.x
写法 直接解构,一行搞定 先取 scope,再 scope.row
可读性 模板里只看到 row 到处都是 scope.xxx
官方态度 推荐,长期支持 已废弃,3.x 不再支持
性能 相同 相同
相关推荐
光影少年9 小时前
react批量更新、同步/异步更新场景
前端·react.js·掘金·金石计划
假如让我当三天老蒯9 小时前
模块化:ES Module 与 CommonJS 的区别
前端·面试
用户40950115773179 小时前
Private Forge v2.0 发布:12大前端业务场景技能系统
前端
weedsfly10 小时前
异步编程全景与事件循环——彻底搞懂 JS 执行机制
前端·javascript
用户0595401744610 小时前
AI Agent记忆测试踩坑实录:Mock骗了我一周,Mem0+pytest一招破局
前端·css
用户17335980753710 小时前
纯前端 PDF 数字签名实战:Vue 3 + pdf-lib 在浏览器里完成签名嵌入
前端·javascript
IT_陈寒11 小时前
SpringBoot自动配置的坑,我爬了三天才出来
前端·人工智能·后端
Avan_菜菜18 小时前
AI 能写代码了,为什么我反而开始要求它先写文档?
前端·github·ai编程
爱勇宝1 天前
鸿蒙生态的下半场:开发者不只要能开发,还要能赚钱
android·前端·程序员
IT_陈寒1 天前
SpringBoot这个自动配置坑我跳了三次
前端·人工智能·后端