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 不再支持
性能 相同 相同
相关推荐
zhuà!4 小时前
腾讯地图TMap标记反显,新增标记
前端·javascript·vue.js
未知原色4 小时前
web worker使用总结(包含多个worker)
前端·javascript·react.js·架构·node.js
ttod_qzstudio4 小时前
CSS改变图片颜色方法介绍
前端·css
幽络源小助理4 小时前
SpringBoot+Vue摄影师分享社区源码 – Java项目免费下载 | 幽络源
java·vue.js·spring boot
curdcv_po4 小时前
我接入了微信小说小程序官方阅读器
前端·微信小程序
程序员鱼皮4 小时前
什么是 RESTful API?凭什么能流行 20 多年?
前端·后端·程序员
+VX:Fegn08954 小时前
计算机毕业设计|基于springboot + vue健身房管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
www_stdio5 小时前
让大语言模型拥有“记忆”:多轮对话与 LangChain 实践指南
前端·langchain·llm
inferno5 小时前
JavaScript 基础
开发语言·前端·javascript
cindershade5 小时前
Intersection Observer 的实战方案
前端