我ui.router
在Angular应用中用于路由。在典型的登录场景中,如果用户未登录,我会将用户重定向到登录URL。如果没有ui.router库,则可以将$
routeChangeStart事件与结合使用,效果很好$location.path
。现在,我正在使用$stateChangeStart
结合了的事件,$state.go
但没有任何效果!它还会将我的浏览器发送到一个无限循环中。我从其他来源了解到,这是一个已知的错误,建议的解决方案都不适合我。而且,$location.path
也不会重定向到登录页面。
这是我配置路径的方式:
.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('main', {
url: '/',
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.state('about', {
url: '/about',
templateUrl: 'views/about.html',
controller: 'AboutCtrl'
})
.state('login', {
url: '/login',
templateUrl: 'views/loginform.html',
controller: 'LoginCtrl'
});
$urlRouterProvider.otherwise("/");
}])
而我的run
方法:
.run(['$state', '$rootScope', '$location', function($state, $rootScope, $location) {
//Check when routing starts
//event, next, current
$rootScope.$on( '$stateChangeStart', function(e, toState, toParams, fromState, fromParams) {
//Redirect to login if the user is not logged in
if (!isUserLoggedIn) {
//Some suggestion
//e.preventDefault();
console.log('Not logged in');
//Infinite loop, kills my browser!
$state.go('login');
$state.transitionTo('login');
//Some suggestion
$state.go('login', { url: '/login'});
//Doesn't work
$location.path('/login');
//$location.path( $state.href('login');
console.log('Redirected');
}
});
如果状态TO已经是“登录”,则我们此处需要的是不要重定向。
只是起草的调整将是
$rootScope.$on( '$stateChangeStart', function(e, toState , toParams
, fromState, fromParams) {
var isLogin = toState.name === "login";
if(isLogin){
return; // no need to redirect anymore
}
...
而且,我们应该调用$state.go('login');
与event.preventDefault();
...
// also prevent default on redirect
$state.go('login');
event.preventDefault();
...
和具有类似解决方案的插件
我已经稍微调整了React路由器的私有路由示例,以便与Redux玩得很好,但是当链接或重定向到其他页面时,不会呈现任何组件。这个例子可以在这里找到: https://reacttraining.com/react-router/web/example/auth-workflow 他们的PrivateRoute组件如下所示: 但是,因为我已经把它合并到一个Redux应用程序中,我不得不稍微调整一下私
英文原文:http://emberjs.com/guides/routing/redirection/ 过渡与重定向 在路由中调用transitionTo或者在控制器中调用transitionToRoute,将停止当前正在进行的过渡,并开启一个新的,这也用作重定向。transitionTo具有参数,其行为与link-to助手相同。 如果过渡到一个没有动态段的路由,路由的model钩子始终都会运行。
问题内容: 我正在使用react-redux和标准react-routing。确定动作后,我需要重定向。 例如:我已经注册了几个步骤。并采取以下措施: 我希望他重定向到带有registrationStep2的页面。怎么做? ps在历史浏览器中从未使用过“ / registrationStep2”。仅在成功注册结果步骤1页面之后,才会显示此页面。 问题答案: 使用React Router 2+,无论
我在react-redux项目中使用react-router-dom 5.1.2。对于我的路由,我有两个文件。第一个是App.js,其中包含redux存储和BrowserRout的提供程序: 在下一层,我有Main.js,它有到所有组件的路径 我遇到的问题是,当我使用path=“/games/:game_id/fighters/new”进入路线时,而不是显示FighterForm。js,它会重定向
我一直试图做一个简单的重定向到按钮点击的另一个组件,但由于某种原因,它不起作用。我想重定向到/dashboard并从登录显示AdminServices,如下所示: //索引。js //应用程序。js //登录。js //管理服务。js