32.vue中新增和编辑用同一组件情况下,解决两项分别可点击和不可点击问题
前言:
最近项目开发中,有遇到需求如下图:
即:在新增时只要求是否配置默认为否且不可点击,但编辑时就比较麻烦了,首先判断是否配置是“是”还是“否”,若“是”,则两个都不可点击,若“否”,则两个都可点击。
1.刚开始写代码时,实现新增时不可点击很简单
直接在show_table这个父组件中声明一个变量去判断,当点新增,使其为true,点编辑,使其为false:
然后在弹框组件中给是否配置的disabled绑定这个变量:
2.编辑页面的要求实现起来就有点复杂
因为编辑页面不是默认使是否配置不可点击,所以得在watch监听里去判断,如果得到的值是0即否,使一个变量为false(可点击),否则为true;同时还是在是否配置那里给其disabled绑定上新变量,绑定的两个变量用||连接:
用 || 连接是为了只要满足其中一个为true,就会使其不可点击,上边代码表示,如果新增,isEdit为true,isEdit1为false,这时也可以实现让其不可点击;如果为编辑,当否时,isEdit为false,isEdit1为false,就可点击,当是时,isEdit为false,isEdit1为true,就不可点击,
3.最后还得解决合并服务名在新增时不做限制
解决方式如下:
以上是 32.vue中新增和编辑用同一组件情况下,解决两项分别可点击和不可点击问题 的全部内容, 来源链接: utcz.com/z/377222.html