web-dev-qa-db-ja.com

反応ルーターでページをリロードするにはどうすればよいですか？

このファイル（ https://github.com/ReactTraining/react-router/blob/v0.13.3/modules/createRouter.js ）で確認できますが、更新機能はありますが、それをどう呼ぶかを考えてください。反応ルーターはかなり新しいので、hashHistoryを使用していくつかのページ間を数回移動するためだけに使用しました。

現在、私はそれを使用しようとしているので、インストールが失敗した場合、ユーザーは、インストールが行われるページ（ユーザーが現在表示されているページ）を更新することで、実行を計画している「再試行」オプションを選択できます。任意の助けをいただければ幸いです。

これは、Webアプリではなく、electronで実行されるノードアプリです。

javascriptreactjsreact-routerelectron
9
Sheriff

本当に必要ありませんreact-router このため。 location.reload ：

location.reload();

また、リンクした反応ルーターのバージョンは非常に古く、現在v4にあるときにv1にリンクしていると思います。

7
Austin Greco

反応ルータを使用していると思います。別の投稿から回答をコピーします。したがって、それを行う可能性はほとんどありません。現在、私のお気に入りの方法は、コンポーネントpropで匿名関数を使用することです。

<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>
5
Darko Pranjic

これを使用して、現在のルートを更新できます。

import createHistory from 'history/createBrowserHistory'
const history = createHistory();
history.go(0)
3
Sumit Kumar

this 回避策を試すことができます：

// I just wanted to reload a /messages page
history.pushState(null, '/');
history.pushState(null, '/messages');
2
Alessander França

履歴オブジェクトをプッシュしてから、コンポーネントをwithrouterにバインドするか、window.location.href = urlリダイレクト..

1
Navnath Adsul