Provide a method for users to get a route pathname

[guaijie]

'useLocation' listens for route changes in a functional component. In some cases we don't need to do any listening at all, just do it once when the component is first loaded.

For example, using 'useOutlet' to implement a TAB feature, each tab corresponds to a route, and switching routes does not destroy the previous TAB. Using 'useLocation' in this case causes all open pages to listen for route changes.

So far, I have come up with a good solution

import { useState } from 'react'
import { useLocation } from 'react-router-dom'
const useTabLocation = () => {
  const [location] = useState(useLocation)
  return location
}

export default useTabLocation

By the feature of useState, useLocation is executed only once, which works fine.
Unfortunately react gives us multiple warnings

Is that why I need to officially provide a method to get the route pathname