use-force-update

Force component to render without state change
Import

Usage

use-force-update returns a function, which when called rerenders the component:

mantine-kmfeptlz6
import { Button, Text, Group } from '@mantine/core';
import { useForceUpdate, randomId } from '@mantine/hooks';
function Demo() {
const forceUpdate = useForceUpdate();
return (
<Group position="center">
<Text>{randomId()}</Text>
<Button onClick={forceUpdate}>Force update</Button>
</Group>
);
}

Definition

function useForceUpdate(): () => void;