Files F100844658

useMergeState.js
No OneTemporary
Actions

Subscribers

None

File Metadata

Created: Mon, Feb 3, 05:28

useMergeState.js
View Options

	function _extends() { _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

	import { useCallback, useState } from 'react';

	/**
	* Mimics a React class component's state model, of having a single unified
	* `state` object and an updater that merges updates into the existing state, as
	* opposed to replacing it.
	*
	* ```js
	* const [state, setState] = useMergeState({ name: 'Betsy', age: 24 })
	*
	* setState({ name: 'Johan' }) // { name: 'Johan', age: 24 }
	*
	* setState(state => ({ age: state.age + 10 })) // { name: 'Johan', age: 34 }
	* ```
	*
	* @param initialState The initial state object
	*/
	export default function useMergeState(initialState) {
	var _useState = useState(initialState),
	state = _useState[0],
	setState = _useState[1];

	var updater = useCallback(function (update) {
	if (update === null) return;

	if (typeof update === 'function') {
	setState(function (state) {
	var nextState = update(state);
	return nextState == null ? state : _extends({}, state, nextState);
	});
	} else {
	setState(function (state) {
	return _extends({}, state, update);
	});
	}
	}, [setState]);
	return [state, updater];
	}

Event Timeline