Tabulator会在加载Tabulator后保留所做的更改

Question

我使用的是"tabulator-tables“”版本:4.0.4“。

在制表器被加载到屏幕上之后，在前端调用转换函数来转换制表器表的一些可见数据。一切都按预期进行了。

问题是，当调整浏览器屏幕大小或打开窗口检查元素时，制表器保留加载制表器后所做的更改(如translate函数)，并显示我们从后端收到的原始数据。

需要帮助:如何保存更改，这些更改不会对浏览器调整大小或打开inspect元素产生影响。

请参考屏幕截图以供参考：

​

​

代码：

async function columnTab(searchData = "", lmt) {
    searchData = searchData ? searchData : await fetchReqUrl("search", `?limit=${lmt}`, "fetch", "POST", "viewform");    
    searchData = (JSON.parse(searchData));     //data fetched from back end
    let DataCollHead = searchData.columns
    let slNo = [{ title: "Sl No.", formatter: "rownum", align: "center", width: 80 }]
    DataCollHead = slNo.concat(DataCollHead)
    let DataCollList = searchData.tableData
    table = new Tabulator("#searchContainer", {
        // movableRows:true,
        columns: DataCollHead,
        layout: "fitColumns",
        pagination: "local",
        paginationSize: 20,
        clipboard: true,
        clipboardPasteAction: "replace",
        clipboard:true,
        clipboardPasteAction:"replace",
        responsiveLayout: "collapse" , 

    })
    var tableData = DataCollList;
    table.setData(tableData);

    let resultRow = dgei('searchContainer')  //function to translate the data
    resultObj()
    formatResult(resultRow);
}

Answer 1

您遇到的问题是因为您试图从表的外部操作表中的数据。

因为Tabulator使用虚拟DOM，所以您不能安全地从外部编辑它的内容，除非它在表被重绘时被覆盖。

如果希望在数据进入表时更改数据，则需要使用Mustator功能。

如果要更改向用户显示数据的方式，则需要使用Formatter功能