1
私はReact Routerを使ってアプリケーションを完成させました。ユーザがページを入力すると、私はAppコンポーネントがDBをフェッチしている間に読み込み画面にリダイレクトされ、フェッチが完了すると、フェッチされたカテゴリにリダイレクトされます。DBをフェッチする際に読み込みページを使用するReact-Router
/ - ><Loader /> - >/App().state.data[0].categoryです。
フェッチが高速に実行されるため、ユーザーは読み込み画面が表示されないことがあります。したがって、ユーザーは経験します。
/ - >/App().state.data[0].categoryです。
だから、私の問題は、ユーザーが/App().state.data[0].categoryページ上にある、と彼はバックボタンを押したとき、彼は見てロード画面上にとどまることです。だから彼は基本的に前のページに戻るためにダブルクリックする必要があります。これは望ましくない。
どのユーザー体験
/App().state.data[0].category - ><Loader /> - >Page before entering the "/"
何ユーザーが経験
/App().state.data[0].category必要があります - 私の質問>Page before entering the "/"
は方法がありますもしローディング画面を飛び越すにはユーザーは戻るボタンを押しますか？
私はhistory npmのものを調べ始めましたが、正しい軌道にいますか？なぜ条件が単一でレンダリングしない
main.js
render(
<Router history={hashHistory}>
<Route path="/" component={App}>
/* This returns the first category from my api */
<IndexRedirect to={App().state.data[0].category} />
<Route path=":category" component={App} />
</Route>
</Router>
,document.getElementById('main'));
App.js
class App extends React.Component{
componentWillMount() {
const router = this.context.router;
fetchData().then(function(results){
router.push(results.data[0].category);
})
}
render() {
return (<Loader/>);
}
}
本当にローダーにURL履歴レコードを与えたいのであれば、ローダーを追加するときに、戻るボタンとして 'window.history.go（-1-numOfLoaders）;'を試して、 'numOfLoaders'を増やすことができます。たとえば、ローダーページが1つあれば、 'window.history.go（-2）'が得られます。 私がしたことがあった場合、私はローダーページにURL履歴レコードを設定していませんでした。 –
あなたが本当に自分の道を譲るならば、 'window.history.length'にいくつかのエラーハンドリングをする必要があります。 –
@AndreLee私は別のフォーラムでこれを投稿し、男は 'router.push'を' router.replace'で置き換えるように言った。それが問題を解決すると思いますか？あなたの解決策も試してみます。 **編集：**バックボタンを言ったとき、私はウェブブラウザ上のものを意味しました – Regex102