Learn React Hooks

Trigger effect only when certain props change

If we want to make sure that our effect function only gets called when the title prop changes, for example, for performance reasons, we can specify which values should trigger the changes, as a second argument to the useEffect Hook:

    useEffect(() => {        document.title = title    }, [title])

And this is not just restricted to props, we can use any value here, even values from other Hooks, such as a State Hook or a Reducer Hook:

    const [ title, setTitle ] = useState('')    useEffect(() => {        document.title = title    }, [title])

As we can see, using an Effect Hook is much more straightforward than using life cycle methods when dealing with changing values.