问题描述
使用 CellRender 时,类基组件不会失败。 使用Function Base Component时出错。
我正在使用材质 ui,并想通过 Cell Render 和 Function Base 组件创建一个按钮操作。
const columnDefs = [
{
field: 'action',headerName: 'Action',cellRenderer: 'actionRenderer',},]
<AgGridReact
style={TableStyle}
rowData={codeData}
rowSelection="multiple"
suppressRowClickSelection={true}
columnDefs={columnDefs}
onSelectionChanged={handleSelectionChange}
frameworkComponents={{
actionRenderer: ActionRenderer,}}
/>
Class Base Component CellRenderer 没有错误
import { Button } from '@material-ui/core';
import React,{ Component } from "react";
export default class ActionRenderer extends Component {
render() {
return (
<Button>
Button
</Button>
);
}
}
函数基础组件 CellRenderer 出错
import { Button } from '@material-ui/core';
import React from "react";
function ActionRenderer() {
return (
<Button>
Button
</Button>
);
}
export default ActionRenderer
此错误信息
reactComponent.js:57 [Violation] Added synchronous DOM mutation listener to a 'DOMNodeInserted'event. Consider using MutationObserver to make the page more responsive.
ReactComponent.init @ reactComponent.js:57
UserComponentFactory.initComponent @ ag-grid-community.cjs.js:13428
UserComponentFactory.createAndInitUserComponent @ ag-grid-community.cjs.js:13181
UserComponentFactory.newCellRenderer @ ag-grid-community.cjs.js:13119
createCellRendererFunc @ ag-grid-community.cjs.js:19360
AnimationFrameService.executeFrame @ ag-grid-community.cjs.js:35597
reactComponent.js:57 位置 = /node_modules/ag-grid-react/lib/reactComponent.js:57
ReactComponent.prototype.init = function (params) {
var _this = this;
this.eParentElement = this.createParentElement(params);
this.renderStaticmarkup(params);
if (this.isstatelessComponent()) {
this.eParentElement.addEventListener('DOMNodeInserted',this.statelessDomInsertedListener,false);
}
过去一周一直在ag-grid-react中搜索DOMNodeInserted和MutationObserver,也看过官方文档,但没有找到。
请帮帮我。
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)