列表附件添加自定义列

场景描述

在列表形式的附件中增加列，输入值存储到附件的json数组中

实现思路

在附件组件的表格列渲染事件中，添加列，列中添加输入框组件，输入框的value属性绑定json的key，在输入框的onChange事件中将值写入json

实现步骤

例如在附件中增加版本号列，存入json的version中

let mainData = useData("mainData");
let onUpload1TableColumnRender = (event) => {
    let { detail: { tableColumns } } = event;
    //定义一个新的列
    let col1 = {
        title: '版本号',
        ellipsis: {
            showTitle: true,
        },
        customRender: (file) => (
            <Input placeholder="请输入版本号" value={file.version} onChange={(value) => {
                //获取数据集中附件列中的数据
                let filesStr = mainData.getValue("files");
                if (!filesStr) {
                    return;
                }
                //转为json数组
                let files = JSON.parse(filesStr);
                //遍历json数组，参数file是当前文件的json，和数据中的storeFileName对比，找到当前文件的json对象，将输入框中的值写入json对象
                for (let i = 0; i < files.length; i++) {
                    if (files[i].storeFileName == file.value.storeFileName) {
                        files[i].version = value;
                    }
                }

                //保存到数据集
                mainData.setValue("files", JSON.stringify(files));
            }} />
        )
    };
    //加入到表格中
    tableColumns.push(col1);
}