4

私のプロジェクトでは、React Router を含めることにしました。私の逆流ストアの 1 つは、いくつかの BL に基づいてパスを把握し、それを変更する必要があります。最初にNavigation、ストア内にミックスインを含めて実行しようとしましthis.transitionTo("Foo");たが、エラーがスローされました:「Uncaught TypeError: 未定義のプロパティ 'router' を読み取れません」。

誰かが、「RefluxJS ストアに存在しないthis.transitionToコンテキスト () を介してルーター プロパティにアクセスしている可能性が高い」と提案しました。これは理解できます。this.context.router

ただし、プログラマチックに、または任意の外部 JS モジュールからルーター パスを変更する方法が必要です。

私のコードは次のようになります。

// routes.js
//////////////////////////////////////////////////////////
var Router  = require('react-router');
var Route   = Router.Route; 
var App     = require('./app');
var Comp    = require('./components/comp');

var routes = (
    <Route path='/' handler={App}>      
        <Route name='Foo' path='/foo' handler={Comp}/>              
    </Route>
);

module.exports = routes;

// main.js
//////////////////////////////////////////////////////////
var React   = require('react');
var Router  = require('react-router');
var routes  = require('./Routes');

var appElement = document.getElementsByTagName('body');

Router.run(routes, Router.HistoryLocation, function(Root, state) {
    React.render(<Root params={state.params} query={state.query} />, appElement);
});

// comp.js
//////////////////////////////////////////////////////////
var React      = require("react");
var Reflux     = require("reflux");
var Actions    = require("../actions/actions.js");
var SomeStore  = require("../stores/some-store.js");

var Comp = React.createClass({

    render: function() {
        return (
            <h1>Hello World</h1>    
        );
    }
});

module.exports = Comp;

// store.js
//////////////////////////////////////////////////////////
var SomeStore = Reflux.createStore({    

    onSomeAction: function() {
        // CHANGE ROUTER PATH HERE TO /foo
    }

});

module.exports = SomeStore;

どんな助けでも大歓迎です！

4

2 に答える 2

1

ルーターは、コンポーネント (React ビュー) によってのみ認識されます。アクションのパラメーターとしてコンテキストからルーターを渡す必要があります。そうすれば、このパラメータを使用して別のルートに遷移できます。このように使ってきました。

ストア内のアクション リスナーの 1 つに以下のようなものがあります。

 _onMyAction: function (router) {
    MyApi.doSomething()
        .then(function (id) {
            // do something ...
            router.transitionTo('myNewRoute', { ref: id });
        })
        .catch(function(message) {
            // handle message
        });
}
于 2015-06-16T20:53:52.017 に答える
0

Reflux アクションは promise を返すため、ストアでこれを行うのではなく (IMO は間違っています)、コンポーネントで行うことができます。

Actions.someAction().then(function() {
    // route transition
});

これが完全に正しいかどうかはわかりませんが、コミュニティが本当に意見をまとめたかどうかはわかりません。

于 2015-06-15T13:45:28.797 に答える