React重置非受控組件state的方法

如果想通過props來重置state的值。有3種方法：

1. 最好的方法：key屬性

修改key屬性的值，可以使組件卸載后重新加載。所有的狀態全部重置。

這種情況可以給key設一個每次渲染都會改變的值。

而且在多層嵌套的情況下，避免了組件的diff。

（遞歸實現樹狀級聯組件，且節點帶有狀態時，每次都需要重置狀態state）

2.  比較特殊屬性：getDerivedStateFromProps

在getDerivedStateFromProps周期中，比較props.id的值，來更新state

3. 通過ref調用實例

class App extends React.Component {
   constructor(props) {
      super(props);
      this.ref = React.createRef();
   }
   componnetDidMount() {
      // this.ref.current指向子組件的實例對象this
      this.ref.current.resetData()
   }
   render() {
      // 只能是類子組件
      return <Child ref={this.ref}>
   }
}

class Child extends React.Component {
   resetData = () => {
      // TODO
   }
   render() {
      return <div></div>
   }
}