Question

当UI事件发生时，我的顶级React组件接收数据以用作外部对象的道具。我想知道更新组件的道具以用于下一个渲染的正确方法。

似乎其中一个组件生命周期方法应该处理这个问题，但似乎并非如此。

下面的代码展示了我尝试过的内容：

• Root.update：数据就绪后，外部调用自定义方法。显示的两种技术都可以正常工作。

• Root.getDefaultProps：用于检索首次渲染的道具。

• Root.render：这也有效，但在首次渲染时是多余的。

• Root.componentWillUpdate：不起作用，但似乎应该这样。

• Root.componentWillReceiveProps：对此无效是不合理的;不会从React组件收到道具。

var Root = React.createClass({

  update: function() {
    this.setProps(Obj.data); // works but setProps is deprecated
    this.props = Obj.data; // always works
  },

  getDefaultProps: function() {
    return Obj.pageload(); // works on first render
  },

  componentWillUpdate: function() {
    this.props = Obj.data. // does not work
    this.setProps(Obj.data); // infinite loop
  },

  componentWillReceiveProps: function() {
    this.props = Obj.data; // does not work
  },

  render: function() {
    this.props = Obj.data; // works but is redundant

    // ...
  },
});

Answer 1

在某些时候，您必须调用React.render来使用您的道具呈现该初始根组件。

要使用新道具更新组件，只需再次使用新道具为同一个Dom元素上的同一组件调用React.render。

这不会重新安装组件，但实际上只是简单地向已安装的实例发送新的道具并使其重新渲染。

如果您想控制组件收到道具时会发生什么，请查看组件生命周期方法componentWillReceiveProps。

从外部源设置道具

1 个答案: