Javascript 如何在react路由器中使用不同的参数链接到当前页面？

假设我设置了以下路线（只是一个示例，实际路线没有这么混乱）：

---

注意：使用react router v4将用户ID和路径道具传递给共享组件，如下所示

class Profile extends React.Component {
    render() {
        const bobId = 423423432; // Pass bobId with path from parent to child
        return (
            <SharedComponent path={"/stuff1/stuff2/`${bobId}`/profile"} />
        );
    }
}


class SharedComponent extends React.Component {
  render() {
    return (
      <div>
        <Link to={this.props.path}>
          Redirect to the same page but with Bob's userid
        </Link>
      </div>
    );
  }
}

export default withRouter(SharedComponent);

类配置文件扩展了React.Component{
render（）{
const bobId=423423432；//使用从父级到子级的路径传递bobId
返回(
);
}
}
类SharedComponent扩展了React.Component{
render（）{
返回(
重定向到同一页面，但使用Bob的用户ID
);
}
}
使用路由器导出默认值（SharedComponent）；

事实上，我找到了一种方法。不确定这是否是最好的方法，但它是有效的：

/**
 * Shared component that's rendered by Profile, Photos and Contact
 */
class SharedComponent extends React.Component {
  render() {
    const { location, match } = this.props;
    const bobId = 423423432;
    const bobUrl = location.pathname.replace(match.params.userid, bobId);

    return (
      <div>
        <Link to={bobUrl}>
          Redirect to the same page but with Bob's userid
        </Link>
      </div>
    );
  }
}

export default withRouter(SharedComponent);

/**
*由个人资料、照片和联系人呈现的共享组件
*/
类SharedComponent扩展了React.Component{
render（）{
const{location，match}=this.props；
const bobId=423423432；
const bobUrl=location.pathname.replace（match.params.userid，bobId）；
返回(
重定向到同一页面，但使用Bob的用户ID
);
}
}
使用路由器导出默认值（SharedComponent）；

---

基本上，我使用当前url（

location.pathname

）并将当前用户id（

match.params.userid

）替换为新id（

bobId

）

您的问题是如何从同一页面链接到同一页面，但将不同的数据传递给自己？这是一个共享组件，所有页面都使用它，我想在该组件中呈现一个链接，该链接将重定向到更新了我的问题的当前页面（使用不同的数据）。。每次我想使用它时，我都必须生成正确的路径并将其传递给

SharedComponent

，这很烦人。。。

class Profile extends React.Component {
    render() {
        const bobId = 423423432; // Pass bobId with path from parent to child
        return (
            <SharedComponent path={"/stuff1/stuff2/`${bobId}`/profile"} />
        );
    }
}


class SharedComponent extends React.Component {
  render() {
    return (
      <div>
        <Link to={this.props.path}>
          Redirect to the same page but with Bob's userid
        </Link>
      </div>
    );
  }
}

export default withRouter(SharedComponent);

/**
 * Shared component that's rendered by Profile, Photos and Contact
 */
class SharedComponent extends React.Component {
  render() {
    const { location, match } = this.props;
    const bobId = 423423432;
    const bobUrl = location.pathname.replace(match.params.userid, bobId);

    return (
      <div>
        <Link to={bobUrl}>
          Redirect to the same page but with Bob's userid
        </Link>
      </div>
    );
  }
}

export default withRouter(SharedComponent);