问题标签 [vuex]

我正在尝试将数据从组件传递到 $route.params.post 但在某处它失败了，我不知道如何让它工作。

在我的组件中，我router-link用来转到路由文件中的特定路径，但它没有路由到指定的组件。

单击该按钮应打开 Replies 组件，其路线看起来像/replies/#，但它只是加载一个空白页面并完全忽略该组件。我正在导入vuex-router-sync我的main.js，但我不知道这是否是问题，但我很清楚这很可能是因为我不完全确定我vuex-router-sync是否正确使用。

我正在使用 Vue 2.x 和 Vuex 2.x 创建一个 Web 应用程序。我正在通过 http 调用从远程位置获取一些信息，我希望如果该调用失败，我应该重定向到其他页面。

但是this.$router.push({path:"/"})给了我以下错误。

Uncaught (in promise) TypeError: Cannot read property 'push' of undefined

这怎么可能实现。

模拟 JsFiddle：这里

在我一直使用的组件中：

this.$router.push({ name: 'home', params: { id: this.searchText }});

改变路线。我现在已经将一个方法移动到我的 Vuex 操作中，当然this.$router不再有效。也没有Vue.router。那么，请问如何从 Vuex 状态调用路由器方法？

我尝试使用大量动态加载的过滤值来完成过滤机制。意味着我得到例如data

然后在我的模板中

我尝试了一些类似的东西：

和

我需要商店中的模型，因为其他组件可以改变它们。

问题是我不知道哪个键以及其中有多少个会出现，所以像下面这样的东西不适合

编辑：为了更好地理解

想象一下，我从一个 API 调用中得到很多人，这些人有很多元数据，比如口语、技能等。在同一个 API 调用中，我得到了可用的语言。我想要做的是根据他们可以说的语言过滤这些人。

但我不知道有多少种语言以及哪些语言即将到来。

所以我尝试做的是以某种方式为每种语言的复选框动态创建 VUEX 状态。另外，我需要为相同的语言创建一个计算变量，以便在 v-model 中绑定。@change 我可以改变 vuex 状态。

编辑：我到现在为止

//使用组件

<filter-checkbox storeKey="language" :values="facets.languages" id_prefix="language_"></filter-checkbox>

然后在全球商店

带有“this.$store.registerModule”的部分我真的不知道如何使用它只是尝试使用动态生成的 VUEX 状态来解决部分

我目前正在开发一个新的 Vue.js 应用程序。它在很大程度上取决于对我的后端数据库的 api 调用。

对于很多事情，我使用 Vuex 存储，因为它管理我的组件之间的共享数据。在查看 github 上的其他 Vue 项目时，我看到一个特殊的 vuex 目录，其中包含处理所有操作、状态等的文件。因此，当组件必须调用 API 时，它会包含 vuex 目录中的操作文件。

但是，例如对于消息，我不想使用 Vuex，因为这些数据只对一个特定的视图很重要。我想在这里使用组件特定的数据。但这是我的问题：我仍然需要查询我的 api。但我不应该包含 Vuex 操作文件。所以这样我应该创建一个新的动作文件。这样我就有了一个特定的文件，其中包含针对 vuex 和单个组件的 api 操作。

我应该如何构建这个？创建一个新目录“api”来处理 vuex 数据和特定于组件的数据的操作？还是分开呢？

我查看 了 几个 问题以找出我做错了什么。在我看来，一切都正确设置。

目标

基于COMPONENT Av-show的值，使用DEPENDENT COMPONENT更改隐藏/显示内容。

问题

在TextField Component内部，有一个输入会触发 my 上的突变vuex store。依赖组件有一个computed值来监听vuex store.

在输入我的TextField Component时，我可以使用Vue.js 扩展来验证突变是否按预期触发。

但是，页面上没有变化。

组件 A

突变

依赖组件

无论我尝试什么，都{{ userInput }}保持空白：{}直到我将路线导航回同一位置。但是没有触发计算值侦听器。

我看到很多 Vue.js 项目使用这种结构：

（这种结构的一个例子是“ Jackblog ”。）

因此，例如，Cart.vue想要更新inCartVuex 中的数据。为此，购物车导入actions.js：

import { inCart } from '../../store/actions'

actions.js导入 api以便它index.js可以连接到 api。然后它会更新 Vuex 存储中的值。

好的，这对我来说很清楚。但现在，我想在Messages.vue模块上工作。该模块也应该连接到 api 以获取所有消息，但不必将结果存储在 Vuex 中。唯一需要数据的组件是 Messages.vue 本身，因此它应该只存储在组件中data()。

问题：我无法actions.js在里面导入，Messages.vue因为该操作不应该更新 Vuex。但我无法将 移动actions.js到api目录，因为这破坏了将所有向商店添加数据的文件放在商店目录中的逻辑。除此之外，逻辑应该放在里面Messages.vue。例如，当 api 返回错误时，error应设置本地 -constant。所以它不能由单独的文件处理。

进行 api 调用并将它们存储在 vuex 或 local 中的推荐应用程序结构是什么data()？将操作文件、api 文件等放在哪里？查看 Jackblog 示例时，它仅支持 Vuex 数据。如何重组它以支持两者？

我在我的 VueJs 应用程序中使用 VueX，在我从服务器获得 4 个我的 get 请求的答案后，我需要关闭预加载器。我尝试使用回调函数来更改预加载器状态，但它会在请求开始后更改，但我需要在所有请求成功后更改预加载器状态。下面是我的代码：

索引.vue

下面我添加一个请求的代码：api/tour.js

Vuex/tour.js

我应该如何更改代码？

我正在遍历这样的列表：

为了判断项目是否处于活动状态，我运行 isActive，这是一个计算函数，用于判断路径是否等于我在 Vuex 商店中的面包屑路径：

问题是我无法访问计算函数中的 item.nextPath，因为我没有将 li 设置为自己的组件。有没有办法将实际项目传递给 isActive 函数以获取其属性？

我有以下吸气剂：

在一个组件中，这个计算属性派生自该 getter：

返回的值是正确的，直到我更改了笔记本电脑数组中的一个元素，然后 getter 没有更新。