Question

我正在创建一个使用json数据的表，当我点击页面中的不同链接时，json“policies”会发生变化，那就是当我点击并改变状态时，我必须生成表格再次使用新的json，但我得到了一个

未捕获错误：不变违规：processUpdates（）：无法找到元素的子元素1。这可能意味着DOM意外地发生了变异（例如，浏览器），通常是因为在使用表时忘记了<tbody>，嵌套了<form>，<p>或{{1}等标记}，或在<a>父级中使用非SVG元素。尝试使用React ID <svg>检查元素的子节点。

第一次正确生成页面加载表。

.0.1.0.2.3.1.1.2.0.1

Answer 1

我只是将渲染移动到创建行的函数：

generateRows: function () {
        var severity = this.renderSeverity();
        var slf = this;
        var cols = this.cols,  // [{key, label}]
            data = this.data;
        //per each item 
        return this.state.policies.map(function (item) {
            // handle the column data within each row
            var cells = cols.map(function (colData) {
                if (colData.key === 'width') {
                    //return <td> <input type="checkbox" name="vehicle" value="Bike" onChange={slf.onChange.bind(null, id) }/></td>;
                    return <td> <input type="checkbox"  onChange={slf.onChangeWidth.bind(null, item.id) }/></td>;
                } else if (colData.key === 'pulsate') {
                    return <td> <input type="checkbox"  onChange={slf.onChangePulsate.bind(null, item.id) }/></td>;

                } if (colData.key === 'policyCheck') {
                    return <td> <input type="checkbox"  onChange={slf.onChangePolicy.bind(null, item.id) }/></td>;
                } else if (colData.key === 'severity') {
                    // colData.key might be "firstName"

                    return <td>{item[colData.key]} {slf.renderSeverity(item.severity) }</td>;
                } else {
                    // colData.key might be "firstName"
                    return <td> {item[colData.key]} </td>;
                }
            });
            return <tbody><tr key={item.id}> {cells} </tr></tbody>;
        });
    }

生成表动态显示错误未捕获错误：不变违规

1 个答案: