在ReactJS中每次重新渲染时获取新的FabricJS-Canvas
提问于 2016-10-27 16:41:35
我有我的以下代码，其中我得到了我的道具的名字列表。我为每个元素创建了一个fabric.IText。
问题:我的页面就像一个待办事项列表。因此，当我添加一个待办事项时，FabricCanvas组件被重新渲染。每次发生这种情况时，我都会在旧画布中得到一个新画布。
我尝试在componentDidMount和componentWillMount中初始化fabric.Canvas，但这两个版本都不起作用。
我使用的是选项卡，所以当我更改选项卡，然后又改回选项卡时，我又得到了一个新画布。
-->
import React from 'react';
import fabric from 'fabric';
var canvas;
var FabricCanvas = React.createClass({
getInitialState: function(){
return{
elements: this.props.elements
};
},
initiateWidgets: function(){
canvas = new fabric.Canvas("FabCan");
for (var key in this.state.elements){
var temp = new fabric.IText(this.state.elements[key]);
canvas.add(temp);
},
render: function(){
this.initiateWidgets();
return(
<canvas id="FabCan"> </canvas>
);
}
});
module.exports = FabricCanvas;
回答 2
Stack Overflow用户
发布于 2016-10-27 17:08:50
您可以使用componentWillReceiveProps
componentWillReceiveProps(newProps){
do something with newProps
}Stack Overflow用户
发布于 2016-10-27 17:13:10
如果你想停止渲染同样的东西，试着使用rectJS提供的shouldComponentUpdate()方法。到目前为止我还没有用过它，但是here's是一个很好的教程，可以帮助你解决这个问题。在react中使用带有getInitialState()的道具是一种糟糕的做法。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/40290052
复制相关文章
腾讯云开发者
