Learn React Hooks

The useMergeState Hook

The useMergeState Hook works similarly to the useState Hook. However, it does not replace the current state, but instead merges the current state with the new state, just like this.setState() works in React class components.

The Merge State Hook returns the following objects:

• state: The current state
• setState: A function to merge the current state with the given state object

For example, let's consider the following component:

1. First, we import the useState Hook:

import React, { useState } from 'react'

2. Then, we define our app component and a State Hook with an object containing a loaded value and a counter value:

export default function MergeState () { const [ state, setState ] = useState({ loaded: true, counter: ...