Use Location Hash

use-location-hash hook

Get Started

Description

This hook is designed to interact with the URL hash (the part of the URL after the # symbol) in a web browser.

install

You can install the package via npm or yarn:

  npm install -d @melmerrouni/custom-hooks

Example

You just need to import useLocationHash from @melmerrouni/custom-hooks:

demo.tsx
 
import {useLocationHash} from '@melmerrouni/custom-hooks';
 
const Target = () => {
  const {hash, updateHash: setHash} = useLocationHash();
  
  const handleChange = (e: ChangeEvent<HTMLInputElement>): void => {
        
        setHash(e.target.value);
    }
 
    return (
        <>
            <div data-testid="target">
                {hash}   
            </div>
            <input value={hash} onChange={handleChange} aria-label="hash-input" />
        </>
    )
};

Demo

Last updated on April 11, 2024
use-keydown-on-textareaUse Online Status