el-table中slot=“header“和#header的区别

<el-table>中,自定义表头单元格内容,可以用<templat slot="header">或者<templat #header>插入自定义表头内容,但如果表头中含有变量,比如<template slot="header">{``{name}}</template>当name变量发生改变时,表头中的内容依旧是旧数据,但是当设置为<template #header>{``{name}}</template>时,表头内容可以根据name动态变化,这是为什么

原因

因为vue中会将slot="header"视为静态内容,在编译阶段就就确定其内容。而使用#head是Vue的一种特殊语法,它会将表头内容作为一个动态插槽处理。动态插槽会被Vue处理为响应式的内容,当数据变化时,Vue会重新渲染插槽内容

相关推荐
掘金安东尼2 分钟前
React 已经改变了,你的 Hooks 也应该改变
前端·vue.js·github
Codebee3 分钟前
A2UI vs OOD全栈方案:AI驱动UI的两种技术路径深度解析
前端·架构
掘金安东尼4 分钟前
TypeScript 严格性是非单调的:strict-null-checks 和 no-implicit-any 的相互影响
前端·面试
1024肥宅16 分钟前
现代 JavaScript 特性:TypeScript 深度解析与实践
前端·javascript·typescript
麦麦大数据20 分钟前
F053 投标推荐可视化系统+推荐算法vue+flask+爬虫
vue.js·爬虫·flask·可视化·推荐算法·招投标
用户479492835691526 分钟前
并发编程里的"堵车"与"红绿灯":死锁、活锁与两种锁策略(乐观锁、悲观锁)
前端·后端
一 乐27 分钟前
智慧医药|基于springboot + vue智慧医药系统(源码+数据库+文档)
java·前端·数据库·vue.js·spring boot·后端
CC码码44 分钟前
告别杂乱数字:用 Intl.NumberFormat 打造全球友好的前端体验
前端·javascript·面试
kandee1 小时前
vscode混淆js文件的插件用法(jshaman)
javascript·ide·vscode
妮妮喔妮1 小时前
Webpack和Vite优化的区别
前端·webpack·node.js