我想setProps从外部呼叫,myComponent以便能够动态更改的数据myComponent。 我希望在更改组件的道具后,它会重新呈现自己。
setProps
myComponent
我正在尝试以下方法:
var myComponent = React.createClass({ render: function () { return ( React.DOM.div(null, this.props.data) ); } }); React.renderComponent( myComponent({ data: someData }), document.getElementById('predictionContent') ); myComponent.setProps({data: someData2});
问题是我不了解如何使用setProps该组件。就我而言,我收到“未定义”错误。
如何解决呢?
警告: setProps在现在已经过时。
React.createClass返回一个类,它React.renderComponent返回具有该setProps方法的类的实例。
React.createClass
React.renderComponent
尝试以下方法:
var MyComponent = React.createClass({ render: function () { return React.DOM.div(null, this.props.data); } }); var myComponent = React.renderComponent( new MyComponent({ data: someData }), document.getElementById('predictionContent') ); myComponent.setProps({ data: someData2 });
话虽如此,Chad Scira的答案也是正确的:重新渲染可能比调用setProps更好。这将使它看起来与render()方法中的代码相同,并且renderComponent无论它是第一次还是随后的更新,您始终可以调用。
renderComponent
像这样:
var MyComponent = React.createClass({ render: function () { return React.DOM.div(null, this.props.data); } }); React.renderComponent( new MyComponent({ data: someData }), document.getElementById('predictionContent') ); // later React.renderComponent( new MyComponent({ data: someData2 }), document.getElementById('predictionContent') );