2

redux-simple-router で react-router を使用する場合 (問題が発生する場合と発生しない場合があります)、すべてのナビゲーション項目リンクに require.ensure がある限り、クリックするまでリンクはアクティブ状態に変わりませんリンクをクリックした後、ページの別の場所に移動します。

ステップバイステップ：

  1. ページをロードします。すべて順調
  2. a をクリックする<Link />とビューが変わります。ただし、リンクはナビゲーション項目のアクティブ状態を更新していません
  3. ページの本文などのどこかをクリックすると、アクティブな状態が現在のナビゲーション項目に正しく表示され、前のナビゲーション項目から外れます

これは使用前には発生せrequire.ensureず0.bundle.js、bundle.js. 現在、各リンクが*.bundle.js各ビューの新しいファイルを作成するローカル環境でのみ発生します。

ルートの例:

module.exports =
    component: 'div'
    childRoutes: [
        path: '/'
        onEnter: (nextState, replaceState) =>
            if nextState.location.pathname == '/'
                replaceState null, '/game'
        component: Master
        childRoutes: [
            path: 'game'
            getComponent: (location, cb) =>
                require.ensure [], (require) =>
                    cb null, require './views/game'
        ,
            path: 'video-policy'
            getComponent: (location, cb) =>
                require.ensure [], (require) =>
                    cb null, require './views/video-policy'
        ,
            path: '*'
            getComponent: (location, cb) =>
                require.ensure [], (require) =>
                    cb null, require './views/404'
        ]
    ]

そして私のルーター：

render() { return (
    <Provider store={store}>
        <Router history={history} routes={routes} />
    </Provider>
)}

私のナビゲーションでは、これがあります：

export default connect(
    state => ({ state: state })
)(HeaderNav);
4

1 に答える 1

3

で使用– そうpure: falseしconnectないと、ルーターからのコンテキスト更新は無視されます。

次に例を示します。

export default connect(
    state => ({ state: state }),
    null, null,
    { pure: false }
)(HeaderNav);

pure: falsenav コンポーネントを直接参照するコンポーネントにも追加する必要があります。

于 2016-01-15T20:00:49.980 に答える