ReactJs：如何在不使用 window.location.reload() 的情况下 Reload/refresh/re-render 组件

Question

我想 reload/refresh/re-render 我的组件，但不使用 ‍‍‍window.location.reload()。有什么可能的方法吗？我试过 this.forceUpdate() 和 this.setState({ state: this.state }); 但是就我而言，这些实际上并没有帮助我。

 testDoneHandler(e) {
    if( this.state && e.origin === document.location.origin ) {
      if( e.data === 'testingClosed' ) {
        this.setState({ state: this.state });
      
      }
    }
  }



 componentDidMount() {
    window.addEventListener('message', this.testingClosed.bind(this));
  }

任何suggestion/help都会提前helpful.Thanks

Answer 1

我想你需要这样的东西：

class t extends React.Component {
  state = {
    forceRerender: 0,
  };
  testDoneHandler(e) {
    if (this.state && e.origin === document.location.origin) {
      if (e.data === "testingClosed") {
        this.setState((value) => ({ forceRerender: value.forceRerender + 1 }));
      }
    }
  }

  componentDidMount() {
    window.addEventListener("message", this.testingClosed.bind(this));
  }

  console.log('forceUpdate', this.state.forceRerender);
}

ReactJs：如何在不使用 window.location.reload() 的情况下 Reload/refresh/re-render 组件

ReactJs: How to Reload/refresh/re-render component without using window.location.reload()

reactjs

reload