如何用組件生命周期替換 useEffect 鈎子？

Question

我被迫使用基於類的組件，那么如何在我的 React 組件中用組件生命周期替換useEffect ，如 componentDidMount、componentDidUpdate 和 componentWillUnmount。 請幫忙

const App = () => {
  useEffect(() => {
    store.dispatch(loadUser());
  }, []);

Answer 1

正如本文檔中提到的 React 團隊

Hooks 是 React 16.8 中的新增功能。 它們讓您無需編寫類即可使用狀態和其他 React 功能。

所以如果你想使用生命周期，你必須使用class 。

使用擴展Component類，它必須是這樣的：

import React from 'react';

class App extends React.Component {
  //you can use components lifecycle here for example : 

  componentDidMount() {
    store.dispatch(loadUser());
  }
}

Answer 2

在聲明構造函數之后，您應該將 componentDidMount 方法放在前面，如下所示：

class yourComponent extends Component {
   constructor(props){
      // constructor taks...
   }

   componentDidMount() {
      // what you want to do when the component mount
   }
}