我正在使用this库来绘制图表。
我将代码这样保存在componentWillMount中,
class FlowDiagramEngine extends Component {
constructor(props) {
super(props);
this.flowJson = this.props.flowDiagramData;
this.state = {};
}
componentWillMount() {
console.log("this.flowJson :"+this.flowJson); // this is empty
var engine = ...
engine.setDiagramModel(model);
.... all code to construct diagram
this.setState({engine: engine});
}
render() {
return (
<div>
<FlowDiagramWidget className="srd-demo-canvas" {...this.state} />
</div>
)
}
}
FlowDiagramWidget
class FlowDiagramWidget extends Component {
render() {
return (
<div>
<Grid container
justify="space-between"
alignItems="center">
<DiagramWidget className="srd-demo-canvas" diagramEngine={this.props.engine} />
</Grid>
</div>
)
}
}
export default FlowDiagramWidget
我希望在componentWillMount中使用Redux道具,但是在执行生命周期方法componentWillMount期间,异步道具为空。 redux道具已在构造函数中正确初始化。
每当我将componentWillMount更改为componentDidMount时,都会出现以下错误。为什么会发生这种情况?
TypeError: Cannot read property 'setMaxNumberPointsPerLink' of null
at DiagramWidget.render (main.js:1)
at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext (ReactCompositeComponent.js:796)
at ReactCompositeComponentWrapper._renderValidatedComponent (ReactCompositeComponent.js:819)
at ReactCompositeComponentWrapper.performInitialMount (ReactCompositeComponent.js:359)
at ReactCompositeComponentWrapper.mountComponent (ReactCompositeComponent.js:255)
at Object.mountComponent (ReactReconciler.js:43)
at ReactDOMComponent.mountChildren (ReactMultiChild.js:234)
at ReactDOMComponent._createInitialChildren (ReactDOMComponent.js:701)
at ReactDOMComponent.mountComponent (ReactDOMComponent.js:520)
at Object.mountComponent (ReactReconciler.js:43)
编辑:我在父容器中有这个
function mapStateToProps(state, ownProps) {
return {
flowDiagramData: state.appReducer.flowDiagramData
}
}