react函数组件中如何拿到路由路径中传的id

要在 React 函数组件中获取路由路径中传递的 id，需要使用 React Router 提供的 `useParams` 钩子函数。首先需要在组件中引入 `useParams`：

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

然后在组件中使用 `useParams` 获取路由参数：

function MyComponent() {
  const { id } = useParams();

  // 在组件中可以使用 id 来进行相应的操作
  // ...
}

其中，`id` 对应的是路由路径中传递的参数名称，例如路由路径为 `"/users/:id"`，则可以通过 `useParams` 获取到 `id` 参数的值。

相关问题

react函数组件里面获取当前路由

在 React 中，可以使用 `useLocation` hook 获取当前路由。

首先，需要在组件中引入 `useLocation`：

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

然后在组件中调用 `useLocation`，它会返回一个包含当前路由信息的对象：

function MyComponent() {
  const location = useLocation();
  // ...
}

`location` 对象包含许多属性，包括 `pathname`，它表示当前路由的路径部分。例如，如果当前路由为 `/users/123`，那么 `location.pathname` 的值将为 `/users/123`。

你也可以使用 `useHistory` hook 获取路由历史记录，或者使用 `useParams` hook 获取路由参数。这些 hook 都需要在组件中引入相应的模块。

react 函数组件如何能访问到子组件中的方法

React 函数组件可以通过 props 将子组件的方法传递给父组件，然后在父组件中调用子组件的方法具体步骤如下：

1. 在子组件中定义一个方法，例如 `childMethod`。
2. 在父组件中创建一个函数，例如 `parentMethod`，并将其作为 prop 传递给子组件。
3. 在子组件中通过 props 接收父组件传递过来的方法，并在需要调用子组件方法的地方调用父组件传递过来的方法。

下面是一个示例代码：

// 子组件
function ChildComponent(props) {
  // 子组件方法
  const childMethod = () => {
    console.log('子组件方法被调用');
  };

  return (
    <div>
      <button onClick={props.parentMethod}>调用父组件方法</button>
    </div>
  );
}

// 父组件
function ParentComponent() {
  // 父组件方法
  const parentMethod = () => {
    console.log('父组件方法被调用');
  };

  return (
    <div>
      <ChildComponent parentMethod={parentMethod} />
    </div>
  );
}

在上面的例子中，当点击子组件中的按钮时，会调用父组件中的 `parentMethod` 方法，并在控制台输出 '父组件方法被调用' 的信息。