更新反应组件而没有父组件在其之外

如果组件没有父组件，我应该如何正确更新组件？

我找到了两种方法来做到这一点：

第一种方法 https://jsfiddle.net/69z2wepo/28597/

这里我通过改变组件的状态来更新组件：

var Hello = React.createClass({
  render: function() {
    if (!this.state) return null;
    return (
      <div>Hello {this.state.name}</div>
    );
  }
});


var component = ReactDOM.render(
  <Hello />,
  document.getElementById('container')
);
component.setState({name: "World"});

setTimeout(function(){
  component.setState({name: "StackOverFlow"});
}, 1000);

第二种方法 https://jsfiddle.net/69z2wepo/28596/

这里我通过更新组件ReactDOM.render method:

var Hello = React.createClass({
  render: function() {
    return (
      <div>Hello {this.props.name}</div>
    );
  }
});


ReactDOM.render(
  <Hello name="world"/>,
    document.getElementById('container')
);

setTimeout(function(){
  ReactDOM.render(
    <Hello name="StackOverFlow"/>,
      document.getElementById('container')
  );

}, 1000);

那么哪种方法是正确的呢？或者也许这是第三个，correct way?

如果您只是想从组件外部触发重新渲染，则公开其forceUpdate方法。

初始的 ReactDOM.render 返回对组件的引用，您可以使用它：

const component = ReactDOM.render(<MyComponent />)

component.forceUpdate()