vxe-动态计算表格列宽度

1.场景

        在实际开发中，根据用户需要或者自定义表格编辑功能组件时候，就需要根据用户自定义选择的复选框数量，文字描述信息来进行动态的计算给对应的表格列进行计算对应的列宽并进行赋值。

2.代码

对应新列

NewColumn(column) {
          const newColumn = {
              title: column.label,
              align: 'center',
              width: this.calculateWidth(column),
              dataType: column.type,
              options: column.options.options,
          };
          this.dynamicColumns.push(newColumn)
      },

动态计算表格

        //   动态计算表头宽度
        calculateWidth(column){
            // 对应同类型列进行判断计算
        if(column.type=='radio'||column.type=='checkbox'||column.type=='state'){
            let arr =column.options.options;
            let optionNumber=arr.length;
            let labelString=''
            for(let i = 0; i < optionNumber; i++){
                // 累加计算，单列中文字内容所在个数
                labelString+= arr[i].label;
            }
            let labelNumber= labelString.length;
            // 对应的列宽=边距+字数*字宽+复选框个数*宽度
            let allWidth =optionNumber*(19+7)+labelNumber*16
            return allWidth
        }
        if(column.type=='switch'||column.type=='uploadFileAll'){
            return '100'
        }
        else{
            return '200'
        }
    },