reactjs - React Router with RefluxJS - Changing route Programmatically from a Store -
in project deiced include react router. 1 of reflux stores need figure out path based on bl , change it. first i've tried including navigation mixin inside store , running this.transitionto("foo"); threw error : "uncaught typeerror: cannot read property 'router' of undefined".
someone suggested : "this.transitionto accessing router property through contexts (this.context.router) not exist in refluxjs stores" ... understand.
however there must way change router path store programmatically, or given external js module.
my code goes this:
// 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 /foo } }); module.exports = somestore; any appreciated!
the router known components (react views). need pass router context parameter in action. way, can use parameter make transition different route. i've been using way.
i have below in 1 of action listeners in store.
_onmyaction: function (router) { myapi.dosomething() .then(function (id) { // ... router.transitionto('mynewroute', { ref: id }); }) .catch(function(message) { // handle message }); }
Comments
Post a Comment