javascript - React:无法在“节点”上执行“removeChild”:要删除的节点不是该节点的子节点
问题描述
我收到此错误“无法在 'Node' 上执行 'removeChild':要删除的节点不是该节点的子节点。”。这是在我的第 3-4 个下拉选择之后发生的。
前几次我选择了一个下拉列表,表格渲染得很好,不知道为什么这会在第 3-4 次间歇性发生?!
下拉选择功能:
public handleDropdownChange(e) {
this.setState({ selectedOption: e.target.value });
{ setTimeout(() => {
this.getDocuments();
}, 1000); }
{ setTimeout(() => {
this.renderDocuments();
}, 2000); }
}
渲染文档功能:
public renderDocuments() {
const docs = this.state.documents.map(document => {
return (
<tr>
<td className="title">{document.Cells.results[3].Value }</td>
<td className="site">{siteName}</td>
<td className="path">{sitePath}</td>
<td><a href={document.Cells.results[6].Value + '?web=1&action=edit'}>View File</a></td>
</tr>
);
});
return (
<div id="tableID" className="table-list-container">
<table className="table-list">
<thead>
<th><button type="button" className="sort" data-sort="title">Title</button></th>
<th><button type="button" className="sort" data-sort="site">Site</button></th>
<th><button type="button" className="sort" data-sort="path">Path</button></th>
<th><button type="button">View File</button></th>
</thead>
<tbody className="list">
{docs}
</tbody>
</table>
<table className="table-footer">
<tr>
<td className="table-pagination">
<ul className="pagination"></ul>
</td>
</tr>
</table>
</div>
);
}
使成为:
public render(): React.ReactElement<IKimProps> {
let { documents } = this.state;
return (
<div className={ styles.kim }>
{"Display Items that are pending review by Favourite Colour:"}
{documents.length === 0 && <p>Loading...</p>}
<select id="dropdown" onChange={this.handleDropdownChange}>
<option value="N/A">N/A</option>
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
</select>
<br/><br/>
{this.renderDocuments()}
</div>
);
}
}
解决方案
没错,JQuery 和 React 一起使用可能会产生这些结果。有足够的 React 包,我建议使用其中之一。
推荐阅读
- excel - 如果在列中按下 Enter 键如何触发代码
- spring-boot - 无法实现对 Spring-Boot API 的基于角色的访问
- java - 有人可以帮助我如何在 mac 计算机中使用 java 程序文件创建可执行文件/应用程序/实用程序吗?
- excel - 需要从过滤器数据中向多个收件人发送电子邮件
- javascript - 注销时内存泄漏
- c# - WPF覆盖用户控件内的xaml加载
- css - 如何使用 CSS-grid 创建一个粘性标题?
- android - 使用具有自定义范围和视图生命周期的 kotlin 协程进行轮询
- python - 无法对 python PMML Pipeline 使用解决方法
- angular - 在错误处理Angular 7 RXJS中发出http请求