当使用$state时，ui-router中的双状态改变.进入$stateChangeStart

Double state change in ui-router when using $state.go in $stateChangeStart

本文关键字：状态 改变 进入 stateChangeStart ui-router state      更新时间：2023-09-26

这是我的活塞。如果您单击profile链接并查看生成的状态更改列表:

stateChanges = [
  " -> home",
  "home -> profile",
  "home -> signIn",
  "signIn -> signIn"
]

你可以看到有一个意想不到的额外状态变化"signIn -> signIn"。

我已经做了一些调试，它似乎是ui-router的反应，通过afterLocationChange功能$locationChangeSuccess。但我不确定这是ui-router中的一个bug，还是我配置ui-router的方式以及我如何管理重定向的结果。如果行为是我的错，我该如何改正?

我真的很感激你的帮助，因为双状态改变导致我的查询参数是双URL编码:/profile -> %2Fprofile -> %252Fprofile，而不仅仅是前两个。

更新

似乎这是0.2.15带来的东西。我尝试使用旧版本，甚至0.2.14工作良好。经过一番调查，我发现这个问题来自于commit 48aeaff。如果我取消那个提交中被注释掉的代码的注释，这个问题甚至在0.2.15上也会消失。现在我将使用这个修改后的0.2.15版本。

我还发现在这个#1573的ui-router的问题跟踪器中有一个问题。

kkIt看起来问题在于您在$stateProvider中添加的Querystring

plunkr演示
    .state("signIn", {
        parent: "frontpage",
        url: "/signIn?returnTo", // <--- remove the ?returnTo
        authorized: false,
        views: {
            "main@frontpage": {
                template: "sign in page"
            }
        }
    })

将其更改为简单的/signIn应该没问题。您可能无法将?queryStrings分配到stateProvider中。

        url: "/signIn" // It should work fine

当我检查你的代码时，我发现了这个块:

else if (authorized === true)
        {
            if (!service.authentication.authorized) {
                $state.go("signIn", {
                    returnTo: toState.url
                });
            }
        }

当您实际单击Home -> Profile时，您将看到authorized = true，而service.authentication.authorized = false。你要求浏览器导航到signIn状态。但是，您已经单击了Profile，并且您将浏览器返回到它所处的相同状态。

我从上面的块中删除了语句event.preventDefault();，现在它似乎工作得很好。

相关文章：