vue iview table列表操作 render(根据不同状态显示不同按钮)
今天在增加操作按钮时遇到了问题,网上找了很多方法,最后找到一个不错的解决方案,以前根据这一行的某个值判断只用了if(字段===“值”),但是条件增加,该方法不能很好的支持业务。话不多说上干货:这次因为要根据 用户状态、用户角色判断,所以,render: (h, params) => {//设置值,如果为这个值,则显示这个 类似于java的三元运算符,R如果不符合条件,则显示:后面let ch
·
今天在增加操作按钮时遇到了问题,网上找了很多方法,最后找到一个不错的解决方案,以前根据这一行的某个值判断只用了if(字段===“值”),但是条件增加,该方法不能很好的支持业务。
话不多说上干货:
这次因为要根据 用户状态、用户角色判断,所以,
render: (h, params) => { //设置值,如果为这个值,则显示这个 类似于java的三元运算符,R如果不符合条件,则显示:后面 let chart = params.row.characterName === '***' let status = params.row.status === '***' return h('div', {style: {width: '100%'}}, [ chart ? h('a',{ props: { type: 'text', size: 'small' }, style:{ marginRight:'5px', color: '#17c1dc' }, on: { click: () => { this.方法(params) } } },'变为普通账户') : h('a', { props: { type: 'text', size: 'small' }, style:{ marginRight:'5px' }, on: { click: () => { this.方法(params) } } }, '变更为VIP'), status ? h('a', { props: { type: 'text', size: 'small' }, style:{ marginRight:'5px' }, on: { click: () => { this.方法(params) } } }, '禁用') : h('a', { props: { type: 'text', size: 'small' }, style:{ marginRight:'5px' }, on: { click: () => { this.方法(params) } } }, '启用'), ]) }
更多推荐
已为社区贡献1条内容
所有评论(0)