问题标签 [vue-router]

我的页面上出现了一些错误，并且 vue-router 警告：

我想知道如何捕捉它并删除此警告？从 vue-router 的文档中，我找不到钩子函数处理错误。我也试图捕捉错误

虽然我现在可以捕捉到错误，但警告仍然出现，我不知道我是否做对了。

出现错误时还有另一个警告

如何摆脱这个？

我有一个使用 vue.js 和 vue-router 的原型。

App.vue 包含我的router-view安装点。App 还包含一个Location基于存储在我的共享状态中的位置数据的组件列表：

应用程序.vue：

state.js：

该Location.vue组件包含v-links我用来触发路由器的组件：

位置.vue：

当单击特定位置时，我想要将给定的位置状态实例作为道具传递给路由器调用的组件（要么 要么Details.vue）。Pics.vuev-link

我遇到的问题是，虽然我知道文档说你可以做到这一点，但他们没有解释如何做到这一点，我也无法弄清楚如何做到这一点。我尝试将位置绑定到router-viewin App.vue：

并将其绑定到内的占位符router-view：

两者都不起作用。

这样做的正确方法是什么？

我在这里有一个问题的 WebpackBin 演示：http ://www.webpackbin.com/4kDRbt28W

我目前正在使用 vue.js 和 vue-router 开发一个项目。我有一个显示一些新闻的 vue，并且我从一个 API（它有点像博客）获得了这些新闻。

我目前正在加载这些新闻router.data以设置组件的数据，如此处所述。它工作得很好，没有问题。

但我的问题是，当我转到此视图时，我想为新闻的幻影设置动画。我尝试过使用ready组件中的属性，但在获取消息之前调用它router.data，这会导致动画错误，因为没有任何元素。

一旦我获取的新闻在 DOM 中完全呈现，我如何触发动画？

这是我的组件的代码：

我正在使用 Vue.js 及其官方路由器开发一个单页应用程序。

我使用路由器加载的每个部分都有一个菜单和一个组件（.vue 文件）。在每个组件中，我都有一些类似的代码：

一旦组件完成过渡，我想执行一段代码（初始化一个 jQuery 插件）。如果我在ready事件中添加我的代码，它只会在第一次加载组件时被触发。如果我在它每次运行时添加我的代码route.activate，这很好，但 DOM 尚未加载，因此无法初始化我的 jQuery 插件。

每次组件完成过渡并且其 DOM 准备就绪时，我如何运行我的代码？

我在 SPA 中使用 Vue 和 Vue 路由器。在视图组件中，我在资源库中查询资源。如果找不到资源，我想在保留 URL 的同时显示 404 页面。

即，如果我访问/foo/non-existant-id，则应显示 404 页面来代替foo资源的显示页面。

为清楚起见，这是我的路由器地图：

在我的FooShowPage我执行以下操作：

本质上，它可能涉及用 替换FooShowPage路由器视图中的NotFoundPage，或重定向到定义的 404 页面，同时保持浏览器历史记录不变。

我的函数应该使用自身的参数将 JSON 迭代地插入到特定级别的嵌套 JSON 的每个元素中，它复制了返回的第一个对象并将其插入到每个嵌套参数中。请参阅下面的屏幕截图和代码，以了解我在做什么。

基本上，我在状态中有一个嵌套的 JSON 对象，并且需要使用从 API 返回 JSON 的操作然后更新状态的突变迭代地附加到现有对象的每个“行”的嵌套属性。

问题在于我认为的突变。我推断我的函数是复制从 API 返回的第一个 JSON 对象。请参阅下面的 Action 和 Mutation 函数，以及 JSON 的 API 函数和结构。

http://api.capecodcommission.org/docs/index.html#sumofannualcapitaltotalsfortreatment

特定组件中的函数使用 v-for 运行：

运行函数，查看 JSON：

V-for 循环：

接口函数：

行动：从 API 中提取 JSON，调度突变函数。

突变：使用 JSON 更新状态。

编辑：下面的图片

组件：http: //i.imgur.com/lcS5Fgo.jpg

JSON结构：http: //i.imgur.com/AsANZOp.jpg

我正在使用 Vue 和 Vue 路由器。一个常见的问题是加载显示某种外部资源的组件时需要一些异步加载。

假设我有一个简单的 Vue 组件，它显示从外部存储库加载的帖子的标题：

我的路由data方法返回一个承诺，当解决后返回插入到组件数据中的 post 对象。

这一切都很好，一旦加载帖子，帖子标题就会显示在页面中，但控制台会引发警告：

[Vue 警告]：评估表达式“post.title”时出错：TypeError：无法读取 null 的属性 'title'

问题是 Vue 试图在设置帖子之前渲染模板。有没有办法在解决方法之前阻止模板渲染（这是我认为waitForData的）route.data()？

我知道我可以使用v-if，但如果可能的话，我想避免过多的 DOM 操作。

我在 Vue 上有一个带有 vue-router 导航的站点，它需要与谷歌驱动器一起使用。我已经在谷歌开发者的控制台中设置了应用程序，令牌 uri，它可以自己正常工作：

但是在集成到 vue-router 导航时，我遇到了一个问题。在向 google ouath2 服务器发出请求后，它会将我重定向到指定地址，并在 url 参数中使用令牌，如下所示：

我想出了几个解决方案：

1. 设置授权重定向 URI 以匹配 vue-router 的格式，以简单地读取为参数，如下所示：

   但是谷歌控制台不允许我这样做给消息

   无效重定向：http ://twine.teivaz.com/#!/login/不能包含片段。

   看来我无法通过第一种方法将我的 vue 可读 URI 粘贴到谷歌控制台中。它应该是这样还是控制台中的错误？

2. 从默认页面的 url 捕获令牌。但是在 vue-router 中，我有一个默认重定向，它会删除所有参数：

   它应该存在于所有不带参数的 url。

   有没有办法在重定向发生之前解析参数并在参数中没有标记的所有情况下保持行为？

3. 创建另一个页面，该页面将简单地将令牌保存到 cookie 并重定向到索引。并在谷歌控制台中进行设置：

   这个选项似乎是一个糟糕的设计，但它实际上可能有效。它是给定的最佳选择吗？有什么我错过的吗？

我今天想做的是将 Vue.js 与 Rails 集成。这基本上是我想要实现的目标：

我必须为此创建一个 Rails 引擎，并使用 Vue.js。我成功地将 Vue 与 Rails 集成，但这是我的问题：

• 价格应该由我在 Rails 中的控制器发送
• 当我做出选择并点击“下一步”时，我的购物车应该会立即更新并自动计算总价
• 当我点击“上一个”时，我的购物车应该会更新
• 而且，我顶部的进度条应该会自动更新。但这是我以后可以关心的另一个故事。

我不知道我是否必须使用 Vue-Router 或其他东西。我想我应该将我所有的 Vue 组件包装在一个父组件中，但是如何处理“上一个”和“下一个”链接？

谢谢 ！

如果我有一个像这样定义的 vue-router 'router-view' 元素：

<router-view transition="slide">

有没有办法在调用特定路线时将过渡更改为“淡入淡出”？