Skip to main content
Version: 5.7.2

useStackState

About​

A React hook that manages state in the form of a stack

Installation​

npm install --save rooks

Importing the hook​

import { useStackState } from "rooks";

Usage​

function Demo() {
// here list is still 1,2,3
// listInReverse is basically list in stack order.
// which is last-in first-out
// so basically listInReverse = 3,2,1
// controls contains utils to change the stack;
const [list, controls, listInReverse] = useStackState([1, 2, 3]);
const { push, peek, pop, length } = controls;

// push(1)
// pop()
// peek()

// This will render items in LIFO order
return (
<div>
{list.map((item) => (
<span>{item}</span>
))}
</div>
);
}

render(<Demo />);

Arguments​

ArgumentsTypeDescriptionDefault value
initialListany[]An arrayundefind

Returned array items​

Returned itemsTypeDescription
pushfunctionPut an item to the top of the stack
popfunctionRemove the item on the top of the stack
peekfunctionReturn the item on the top of the stack
lengthnumberNumber of items in the stack

Codesandbox Examples​

Basic Usage​

Join Bhargav's discord server​

You can click on the floating discord icon at the bottom right of the screen and talk to us in our server.