如何在 React 中获取 URL 参数？ localhost:3000/reset-password/:token [重复]答案

【问题标题】：How to get the URL parameters in React ? localhost:3000/reset-password/:token [duplicate]如何在 React 中获取 URL 参数？ localhost:3000/reset-password/:token [重复]
【发布时间】：2019-01-02 12:54:37
【问题描述】：

我已经被这个问题困扰了一段时间，而且我对 React 还是有点陌生。如何在不使用 windows.href 的情况下以 React 方式获取 URL 令牌并将其传递给我的 resetPasswordToken？

在我的路线中

<Route path="/reset-password/:token" component={ResetToNewPassword} />

网址

http://localhost:3000/reset-password/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MywiZW1haWxBZGRyZXNzIjoiYXJ0aHVydHJ1b25nLndvcmtAZ21haWwuY29tIiwiZmlyc3ROYW1lIjoiQXJ0aHVyIiwicm9sZSI6IlVzZXIiLCJ0eXBlIjoiUGF0aWVudCIsImxhc3ROYW1lIjoiVHJ1b25nIiwiaWF0IjoxNTQ2NDMyOTA1LCJleHAiOjE1NDY0MzQ3MDV9.LhWsrovx1l4lHDBxZ3nwrMhA_ADoLkZFn2XjKeSzNIg

代码

    handleSubmit = e => {
    e.preventDefault();

    const { onSubmit = () => {} } = this.props;

    this.props.form.validateFields((err, values) => {
      if (err) return;
      const { match = {} } = this.props;
      const { params = {} } = match;
      const resetPasswordToken = params.resetPasswordToken;
      onSubmit({
        ...values,
        resetPasswordToken
      });
    });
  };

【问题讨论】：

<Route path="/reset-password/:token 你已经将你的参数（通配符）称为 token 并且你需要像@Kabbany 所说的那样将它作为 token 来获取，@987654325 @，但你试图把它作为match.params.resetPasswordToken

标签： reactjs

【解决方案1】：

按照文档，您可以看到您可以从组件访问 url 参数 - 在您的情况下为 ResetToNewPassword - 作为属性 match.params。

在你的情况下：match.params.token

这里的例子： https://reacttraining.com/react-router/web/example/url-params

【讨论】：