React Router v6: navigate 中的 relative 属性详解

在 React Router v6 中，'relative' 是用于指定相对路径的一个属性。它可以在 'navigate' 方法中使用，用于指示导航的相对路径。

当使用相对路径时，可以将 'relative' 属性设置为 'true'，这样导航将基于当前路径进行相对导航。这在嵌套路由中特别有用，可以避免手动构建完整的路径。

以下是一个示例：

import { useNavigate } from 'react-router-dom';

function MyComponent() {
  const navigate = useNavigate();

  const handleNavigation = () => {
    navigate('../other'); // 相对于当前路径向上一级，并导航到 'other' 路径
  };

  return (
    <button onClick={handleNavigation}>Navigate</button>
  );
}

在上面的示例中，当点击按钮时，将执行导航到相对于当前路径的 '../other' 路径。

请注意，'relative' 属性在 v6 中是一个布尔值，而在 v5 中是一个字符串。在 v6 中，如果不提供 'relative' 属性，则默认为 'false'，表示绝对路径导航。