useeffect replace componentWillReceiveProps code example

Example 1: componentwillreceiveprops hooks

SomeComponent (props) => {

    useEffect( () => {
        console.log('someProp updated');
    }, [props.someProp])


    return <div>Hi {props.someProp}</div>
}

Example 2: componentwillreceiveprops hooks

const { useState, useEffect, useMemo } = React;

function App() {
  const [count, setCount] = useState(50);

  useEffect(() => {
    setTimeout(() => {
      setCount(150);
    }, 2000);
  }, []);

  return <DisplayCount count={count} />;
}

function DisplayCount(props) {
  const count = useMemo(() => props.count > 100 ? 100 : props.count, [props.count]);

  return <div> {count} </div>;
}

ReactDOM.render(<App />, document.getElementById("root"));