iview render 里面怎么用 disabled

iview table中按钮根据条件设置disabled

效果图如下:

初始的table

iview render 里面怎么用 disabled_第1张图片

加了disabled的Table

iview render 里面怎么用 disabled_第2张图片

注: 当socket 没有返回 分区状态的时候,右侧的操作里面的按钮置灰不可点击。判断条件 disabled: (!params.row.excutStatus)

代码实现方式:disabled后直接跟true或者false的条件

{ title: "广播信源类型", key: "infoSourceTypeName", width: 200, align: "center", tooltip: 'false' },
        { title: '操作', key: 'action', width: 145, align: 'center', fixed: 'right',
          render: (h, params) => {
            return h('div', [
              h('Button', {
                props: {
                  type: 'primary', size: 'small', 
                  disabled: (!params.row.excutStatus)
                },
                style: {
                  // marginRight: '8px',
                  marginLeft: '30px'
                },
                on: {
                  click:()=> {
                    console.log("rowww:", params.row);
 }
                }
              }, '添加监听'),
            ])
          }    
        }

以上都是一些简单的使用,电商订单可能比这复杂些,原理基本都一样。

想了解更多请进群沟通学习:https://qm.qq.com/cgi-bin/qm/qr?k=xd3AN6a1eOtRoy4xXTq4CC-08g41gPgl&group_code=625787746

 

 

你可能感兴趣的:(iview组件,javascript)