iview table设置状态类的一列数据样式

 在columns中设置字段及样式

 

{
          title: '计划状态',
          key: 'processStateName',
          minWidth: 120,
          align: 'center',
          render: (h, params) => {
            if (params.row.processStateName == '已保存(草稿)') {
              return h('div',
                {
                  style: {
                    width: '90px',
                    height: '30px',
                    lineHeight: '30px',
                    fontSize: '14px',
                    color: '#fff',
                    backgroundColor: '#ccc'
                  }
                }, params.row.processStateName
              )
            } else if (params.row.processStateName == '审批中') {
              return h('div',
                {
                  style: {
                    width: '70px',
                    height: '30px',
                    marginLeft: '10px',
                    lineHeight: '30px',
                    color: '#fff',
                    fontSize: '14px',
                    backgroundColor: 'blue'
                  }
                }, params.row.processStateName
              )
            } else if (params.row.processStateName == '已完结') {
              return h('div',
                {
                  style: {
                    width: '70px',
                    height: '30px',
                    marginLeft: '10px',
                    lineHeight: '30px',
                    color: '#fff',
                    fontSize: '14px',
                    backgroundColor: 'green'
                  }
                }, params.row.processStateName
              )
            }
          }
        },