Reactjs React-路径相同但参数不同的路由会在更新时更改数据

我正在创建一个页面，您可以在其中查看人员配置文件及其所有项目，该页面包含

pathname=“/users/{this id}”

和一个菜单，可以将您带到您的配置文件。但我的问题是，当您转到一个persons profile页面，然后转到另一个页面时，路径名会更改，但数据不会呈现，它只会更改路径名，并且数据保持不变。为了呈现数据，您必须刷新页面，然后页面显示新用户数据。我如何获得它，使您不必刷新页面，就像他们单击要访问的用户一样，在不刷新页面的情况下更改路径名并呈现新数据？此外，在用户配置文件中刷新页面时会发生一些情况，它应该返回用户的电子邮件地址，这在您第一次访问页面时就是这样做的，但当您刷新页面时，它会返回一个错误，表示找不到电子邮件

以下是菜单部分的代码（链接到我的个人资料）：

从“流星/流星”导入{Meteor}
从“React”导入React；
从“react router dom”导入{withRouter，Link}；
从“/SubjectRoutes/SubjectRoutes”导入{SubjectRoutes}”；
从“/AddNote”导入AddNote；
类菜单扩展了React.Component{
render（）{
返回(
菜单
家

笔记
添加注释

我的个人资料

)
}
}
使用路由器导出默认值（菜单）

userProfile.js：

import { Meteor } from "meteor/meteor";
import React from "react";
import { withRouter } from "react-router-dom";
import { Tracker } from "meteor/tracker";

import Menu from "./Menu";
import RenderNotesByUserId from "./renderNotesByUserId"

class userProfile extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      email: ""
    };
  }
  logoutUser(e){
    e.preventDefault()
    Accounts.logout(() => {
      this.props.history.push("/login");
    });
  }
  componentWillMount() {
    Meteor.subscribe('user');
    Meteor.subscribe('users');
    this.tracker = Tracker.autorun(() => {
      const user = Meteor.users.findOne(this.props.match.params.userId)
      this.setState({email: user.emails[0].address})
    });
  }
  render(){
    return(
      <div>
        <Menu />
        <button onClick={this.logoutUser.bind(this)}>Logout</button>
        <h1>{this.state.email}</h1>
        <RenderNotesByUserId filter={this.props.match.params.userId}/>
      </div>
    )
  }
}
export default withRouter(userProfile);

从“流星/流星”导入{Meteor}；
从“React”导入React；
从“react router dom”导入{withRouter}；
从“流星/跟踪器”导入{Tracker}；
从“/Menu”导入菜单；
从“/RenderNotesByUserId”导入RenderNotesByUserId
类userProfile扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
电子邮件：“
};
}
注销用户（e）{
e、 预防默认值（）
帐户。注销（（）=>{
this.props.history.push（“/login”）；
});
}
组件willmount（）{
Meteor.subscribe（“用户”）；
Meteor.subscribe（“用户”）；
this.tracker=tracker.autorun（（）=>{
const user=Meteor.users.findOne（this.props.match.params.userId）
this.setState（{email:user.emails[0].address}）
});
}
render（）{
返回(
注销
{this.state.email}
)
}
}
使用路由器导出默认值（用户配置文件）；

很抱歉把这个问题问了这么久，这是一个非常奇怪的问题，我在网上似乎找不到任何答案

ComponentWillMount（）

在呈现组件之前只运行一次。您还需要使用

组件willreceiveprops（）

，以便在道具更改时更新您的状态

退房

import { Meteor } from "meteor/meteor";
import React from "react";
import { withRouter } from "react-router-dom";
import { Tracker } from "meteor/tracker";

import Menu from "./Menu";
import RenderNotesByUserId from "./renderNotesByUserId"

class userProfile extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      email: ""
    };
  }
  logoutUser(e){
    e.preventDefault()
    Accounts.logout(() => {
      this.props.history.push("/login");
    });
  }
  componentWillMount() {
    Meteor.subscribe('user');
    Meteor.subscribe('users');
    this.tracker = Tracker.autorun(() => {
      const user = Meteor.users.findOne(this.props.match.params.userId)
      this.setState({email: user.emails[0].address})
    });
  }
  render(){
    return(
      <div>
        <Menu />
        <button onClick={this.logoutUser.bind(this)}>Logout</button>
        <h1>{this.state.email}</h1>
        <RenderNotesByUserId filter={this.props.match.params.userId}/>
      </div>
    )
  }
}
export default withRouter(userProfile);