【Vue组件eval方法的使用】

Vue页面中条件可以放在当前vue页面中而无需影响到组件


这是我的表格操作列按钮,需求是第四个按钮如果表格当前数据的is_execl字段为0则显示否则隐藏

这种条件判断很频繁 如果像之前一样给一个标识,页面多了就难以维护,而且判断条件如果不一样还不便维护

灰-常难用

如果按照我的方法

js 复制代码
hidden: "scope.row['is_execl']==0",

传递这个hidden,条件自定义也可为1,2,3等等

在组件内

复制代码
...
v-if="item.hidden?isBoolean(item,scope):true"
//我们需要渲染的标签条件


...
const isBoolean = (item, scope) => {
  return eval(item.hidden);
};
//eval这个灰常好用 是把传递过来的字符转为函数、变量、等等
...

只需要改变hidden里边的条件就可以了

灰常好用

相关推荐
旧味清欢|2 分钟前
关注分离(Separation of Concerns)在前端开发中的实践演进:从 XMLHttpRequest 到 Fetch API
javascript·http·es6
热爱编程的小曾19 分钟前
sqli-labs靶场 less 8
前端·数据库·less
gongzemin30 分钟前
React 和 Vue3 在事件传递的区别
前端·vue.js·react.js
Apifox43 分钟前
如何在 Apifox 中通过 Runner 运行包含云端数据库连接配置的测试场景
前端·后端·ci/cd
-代号95271 小时前
【JavaScript】十四、轮播图
javascript·css·css3
麦麦大数据1 小时前
neo4j+django+deepseek知识图谱学习系统对接前后端分离前端vue
vue.js·django·知识图谱·neo4j·deepseek·在线学习系统
树上有只程序猿1 小时前
后端思维之高并发处理方案
前端
庸俗今天不摸鱼2 小时前
【万字总结】前端全方位性能优化指南(十)——自适应优化系统、遗传算法调参、Service Worker智能降级方案
前端·性能优化·webassembly
QTX187302 小时前
JavaScript 中的原型链与继承
开发语言·javascript·原型模式
黄毛火烧雪下2 小时前
React Context API 用于在组件树中共享全局状态
前端·javascript·react.js