Javascript react路由器链接到，内置地图功能，只工作一次

我遵循了这一点，但当我在另一个用户上再次单击时，用户组件状态似乎仍然没有改变。 因此，我只能看到一个用户

package.json

 {
  "name": "raspberry",
  "version": "1.0.0",
  "description": "raspberry =========",
  "main": "index.js",
  "scripts": {
    "start": "node webpack.dev-server.js",
    "build": "webpack"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "react": "^0.14.7",
    "react-bootstrap": "^0.30.7",
    "react-dom": "^0.14.7",
    "react-router": "^2.0.0",
    "superagent":"^3.3.2"
  },
  "devDependencies": {
    "babel-core": "^6.21.0",
    "babel-loader": "^6.2.10",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0",
    "bootstrap-sass": "^3.3.7",
    "css-loader": "^0.26.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "file-loader": "^0.9.0",
    "node-sass": "^4.3.0",
    "react-bootstrap": "^0.30.7",
    "react-hot-loader": "^1.3.0",
    "sass-loader": "^4.1.1",
    "style-loader": "^0.13.1",
    "webpack": "^1.14.0",
    "webpack-dev-server": "^1.16.2"
  }
}

app.js

ReactDom.render((
    <Router history={hashHistory}>
        <Route path="/" component={Layout}>
            <IndexRoute component={Home} />
            <Route path="/home" component={Home}/>
            <Route path="/users" component={Users}>
                <Route path="/users/:userId" component={User}/>
            </Route>
            <Route path="*" component={NoMatch} />    
        </Route>
    </Router>
), document.getElementById('app'));

ReactDom.render((
)，document.getElementById（'app'）；

Users.js

const Users = React.createClass({
    getUsers: function() {
        var self = this;
        request
            .get('/api/users')
            .set('Auth', 'Bearer '+ this.state.token)
            .end(function(err, res){
                if (res.statusCode === 200){
                    self.setState({
                        users:JSON.parse(res.text)
                    }) ;

                }else{
                    console.log('Get Users failed');
                }

        });

    },
    getInitialState: function(props) {
        props = props || this.props;
        return {
            token : localStorage.getItem("token"),
            users:[]

        };
    },
    componentDidMount: function() {
        this.getUsers();
    },
    render: function() {
        return(
            <div>
                <h1>Users</h1>
                <div className="master">
                  <div className="list-group">
                    {this.state.users.map(user => (
                      <Link to={`/users/${user.id}`} key={user.id} className="list-group-item">{user.username}</Link>
                    ))}
                  </div>
                </div>
                <div className="detail">
                  { this.props.children }
                </div>
              </div>
        );
    }
});

export default Users;

const Users=React.createClass({
getUsers:function（）{
var self=这个；
要求
.get（“/api/users”）
.set（'Auth'，'Bearer'+this.state.token）
.end（函数（err、res）{
如果（res.statusCode==200）{
自我状态({
用户：JSON.parse（res.text）
}) ;
}否则{
log（'Get Users failed'）；
}
});
},
getInitialState:函数（道具）{
道具=道具| | this.props；
返回{
令牌：localStorage.getItem（“令牌”），
用户：[]
};
},
componentDidMount:function（）{
这是getUsers（）；
},
render:function（）{
返回(
使用者
{this.state.users.map（user=>(
{user.username}
))}
{this.props.children}
);
}
});
导出默认用户；

User.js

const User = React.createClass({
    findUserById: function(id){
        var self = this;
        request
            .get('/api/users/'+id)
            .set('Auth', 'Bearer '+ localStorage.getItem("token"))
            .end(function(err, res){
              console.log(res);
                if (res.statusCode === 200){
                    self.setState({
                        user:JSON.parse(res.text)
                    }) ;

                }else{
                    console.log('Get User failed');
                }

        });
    },
    getInitialState: function() {
        return {user:''};
    },       
    componentDidMount: function() {
        console.log('componentDidMount');
        this.findUserById(this.props.params.userId)
    },

  render:function() {
    return (
      <div>
        <h2>{this.state.user.username}</h2>
      </div>
    )
  }
});
export default User;

const User=React.createClass({
findUserById:函数（id）{
var self=这个；
要求
.get（'/api/users/'+id）
.set（'Auth'，'Bearer'+localStorage.getItem（“令牌”））
.end（函数（err、res）{
控制台日志（res）；
如果（res.statusCode==200）{
自我状态({
用户：JSON.parse（res.text）
}) ;
}否则{
log（'Get User failed'）；
}
});
},
getInitialState:函数（）{
返回{用户：'}；
},       
componentDidMount:function（）{
log（'componentDidMount'）；
this.finduserbyd（this.props.params.userId）
},
render:function（）{
返回(
{this.state.user.username}
)
}
});
导出默认用户；

如果您在位置

/users/17

，则将呈现组件

、

和

。如果随后导航到位置

/users/5

，仍将渲染相同的组件。这意味着为了使

基于新的

参数进行渲染，您需要在该组件上实现
组件将接收props
或
组件diddupdate
方法。
我认为
应该是
。根据您的实现方式，此组件在
/users/users/：userId
下呈现。不，您的建议不起作用，但感谢您的帮助。非常感谢：）