Javascript 如何在不刷新ReactJs中的页面的情况下重新加载URL？

我正在尝试重新加载到同一路线，而不必刷新页面。对于此特定情况，使用

history.pushState（）

，但我得到一个错误：

TypeError:history.pushState不是函数

这是我的密码：

import React from 'react';
import PropTypes from 'prop-types';
import { Container } from 'kawax-js';
import { Switch, Route } from 'react-router-dom';
import File from './FileContainer';
import Folder from './FolderContainer';
import HomeContainer from './HomeContainer';

class RootContainer extends React.Component {

  static stateToProps = ({ ownProps, select }) => {
   const files = select('files');
   const lastFile =  _.last(files);
   return ({
    lastFile: lastFile || {}
 })
};

  static propTypes = {
   history: PropTypes.object.isRequired
};

  static defaultProps = {
   lastFile: {}
};

render() {
 const { lastFile, history } = this.props;
 if( lastFile === {} || !lastFile.isUploaded
  || lastFile.isUploaded === null) {
  return (
    <Switch>
      <Route exact path="/" component={HomeContainer} />
      <Route exact path="/file/:itemPath/:refHash" component={File} />
      <Route exact path="/:folderName" component ={Folder}/>
    </Switch>
   );
  }
  return history.pushState(null, "/:folderName")
 }
}

export default Container(RootContainer);

从“React”导入React；
从“道具类型”导入道具类型；
从“kawax js”导入{Container}；
从“react router dom”导入{Switch，Route}；
从“/FileContainer”导入文件；
从“/FolderContainer”导入文件夹；
从“./HomeContainer”导入HomeContainer；
类RootContainer扩展了React.Component{
静态stateToProps=（{ownProps，select}）=>{
const files=选择（“文件”）；
const lastFile=u.last（文件）；
返回({
lastFile:lastFile |{}
})
};
静态类型={
历史记录：PropTypes.object.isRequired
};
静态defaultProps={
最后一个文件：{}
};
render（）{
const{lastFile，history}=this.props；
如果（lastFile=={}| |！lastFile.isupload
||lastFile.isupload==null）{
返回(
);
}
返回history.pushState（null，“/：folderName”）
}
}
导出默认容器（RootContainer）；

是否有更好的方法来执行此操作，或者我在这里遗漏了什么？

请使用此代码 Router.browserHistory.push（'/'）；

---

安装history.pushState（null，“/：folderName”）

您几乎没有这样做的可能性，目前我最喜欢的方法是在组件属性中使用匿名函数：

<Switch>
  <Route exact path="/" component={()=><HomeContainer/>} />
  <Route exact path="/file/:itemPath/:refHash" component={()=><File/>} />
  <Route exact path="/:folderName" component ={()=><Folder/>}/>
</Switch>

} />
} />
}/>

或者，如果您想使用当前url参数刷新，则需要额外的路由（重新加载），并使用路由器堆栈进行一些操作：

reload = ()=>{
 const current = props.location.pathname;
 this.props.history.replace(`/reload`);
    setTimeout(() => {
      this.props.history.replace(current);
    });
}

<Switch>
  <Route path="/reload" component={null} key="reload" />
  <Route exact path="/" component={HomeContainer} />
  <Route exact path="/file/:itemPath/:refHash" component={File} />
  <Route exact path="/:folderName" component ={Folder}/>
</Switch>

<div onCLick={this.reload}>Reload</div>

reload=（）=>{
const current=props.location.pathname；
this.props.history.replace（`/reload`）；
设置超时（（）=>{
this.props.history.replace（当前）；
});
}
重新加载

刷新历史记录的目的是什么？但这只会将我重定向到我的主页，我希望它只是重新加载我当前所在的页面。然后你在/I尝试后放入当前url，但我得到

根容器（…）：渲染未返回任何内容。这通常意味着缺少返回语句。或者，若不呈现任何内容，则返回null。

我也尝试了

，但在本例中，我得到：

您尝试重定向到当前所在的同一路径：“/test”

尝试此位置。重新加载（）；以前尝试过：D，一个实际上刷新了我不想要的页面，我想让它保持单页，不需要刷新任何内容。我在这里真的疯了。。。