在我的项目中,我提议包括React Router.我的一个Reflux商店需要找出基于某些BL的路径而不是改变它.首先,我尝试在Store中包含Navigation mixin并运行this.transitionTo(“Foo”);这引发了一个错误:“Uncaught TypeError:无法读取未定义的属性’router’”.
有人建议:“this.transitionTo可能通过上下文(this.context.router)访问路由器属性,这在RefluxJS商店中不存在”……我理解.
但是,必须有一种方法可以通过编程方式或任何给定的外部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;
任何帮助将不胜感激!
解决方法
路由器仅为组件所知(React视图).您需要将环境中的路由器作为操作中的参数传递.这样,您可以使用此参数转换到其他路径.我一直用这种方式.
我在商店里的一个动作听众中有类似下面的内容.
_onMyAction: function (router) { MyApi.doSomething() .then(function (id) { // do something ... router.transitionTo('myNewRoute',{ ref: id }); }) .catch(function(message) { // handle message }); }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。