Document Title

Docs

Document Title

Manage state with default values.

About

The useDocumentTitle hook is handy for dynamically updating a webpage's title based on the current state or data. This is particularly useful in scenarios where the title needs to change in real-time, such as showing the name of a currently selected item or reflecting changes in the application state.

Parameters

Name	Type	Description
title	string	The title to be set for the document.

Installation

Run the following command:

npx scriptkavi-hooks@latest add document-title

Usage

import { useDocumentTitle } from "@/hooks/document-title"

import * as React from "react"
 
export default function App() {
  const [count, setCount] = React.useState(0)
 
  useDocumentTitle(`Clicked ${count} times.`)
  return (
    <section>
      <h1>useDocumentTitle</h1>
      <h6>
        <a
          className="link"
          href="https://6vmc1n.csb.app/"
          target="_blank"
          rel="noreferrer"
        >
          Try in a new tab
        </a>
      </h6>
      <button className="primary" onClick={() => setCount(count + 1)}>
        Increment Count: {count}
      </button>
    </section>
  )
}

Default Favicon