简体   繁体   中英

How to replace useEffect hook with component lifecycle?

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());
  }, []);

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());
  }
}

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
   }
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM