【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里边的条件就可以了

灰常好用

相关推荐
excel21 小时前
Vue 3 深度解析:defineModel() 与 defineProps() 的区别与底层机制
前端
excel21 小时前
深入解析 processDefineExpose:Vue SFC 编译阶段的辅助函数
前端
dcloud_jibinbin21 小时前
【uniapp】小程序体积优化,分包异步化
前端·vue.js·webpack·性能优化·微信小程序·uni-app
桜吹雪21 小时前
自定义instanceof运算符行为API: Symbol.hasInstance
前端
qq_4275060821 小时前
基于Vue 3和Element Plus实现简单的钩子函数管理各类弹窗操作
前端·javascript·vue.js
excel21 小时前
深入解析:ScriptCompileContext —— Vue SFC 脚本编译上下文的核心机制
前端
粥里有勺糖21 小时前
视野修炼-技术周刊第126期 | TypeScript #1
前端·node.js·github
冰暮流星21 小时前
css3新增过渡
前端·css·css3
天黑请闭眼1 天前
视频文件上传至服务器后浏览器无法在线播放
前端
一位搞嵌入式的 genius1 天前
前端实战开发(四):从迭代器到异步编程:ES6 Generator 全面解析 + 实战问题排查
开发语言·前端·es6·前端实战