如何用组件生命周期替换 useEffect 钩子？

Question

I'm forced to use class based component, so how can I replace useEffect with component lifecycle like componentDidMount, componentDidUpdate and componentWillUnmount in my React component. Please help

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

Answer 1

As React team mentioned in this doc

Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class.

So if you want to use life cycles you have to use class .

Use class that extends Component and it must be like this :

import React from 'react';

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

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

Answer 2

After delcaring the constructor you should put the componentDidMount method just ahead, like this:

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

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