javascript - (VueJS) Vuex getter 应该根据另一个模块状态变化进行更新

标签 javascript vue.js vuejs2 vuex

我有两个 Vuex 存储模块:ListItemsListSortListItems 有一个 getter,它基本上是根据这两个模块的状态计算的。请看下面的代码:

// Import the ListSort store module
import listSort from './list-sort';

// ListItems getters
const getters = {
  companiesSorted: () => {
    return _.orderBy(state.companies,
      [listSort.state.sortAttribute],
      [listSort.state.sortDirection]);
  },
};

但是,当 ListSort 中的状态发生变化时(即 sortAttributesortDirection 发生变化),这不会导致 ListItems getter重新计算。我如何告诉 Vuex,鉴于对计算 companiesStored 的依赖性发生了变化,Vuex 应该重新计算该 getter?

谢谢!

最佳答案

How can I tell Vuex that, given a dependency to computing companiesStored has changed, Vuex should recompute that getter?

您不需要,它会自动为您完成! Vue 对懒惰的开发人员来说不是很棒吗?

唯一应该导入 Vuex 模块的 JS 模块是通过 new Vuex.Store 初始化 Vuex 的 JS 模块,它将 Vuex 模块捆绑在一起。

Vuex 模块 getter 可以访问它们的本地 staterootStaterootState 是您访问其他模块数据的地方。

https://vuex.vuejs.org/en/modules.html#module-local-state

它应该看起来像这样:

companiesSorted: (state, getters, rootState) => {
    return _.orderBy(state.companies,
      [rootState.listSortModule.sortAttribute],
      [rootState.listSortModule.sortDirection]);
  },

listSortModule 是您为模块指定的名称。

关于javascript - (VueJS) Vuex getter 应该根据另一个模块状态变化进行更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44912406/

相关文章:

node.js - 使用express和vue js登录成功后如何重定向到特定页面?

javascript - AngularUI DatePicker - JavaScript - 获取 SQL 日期格式时休息一天

javascript - 在不打开相机的情况下请求相机许可

javascript - Laravel 和 jquery 中删除文件的问题

javascript - Vuetify - v-text-field(类型 ="number") - 设置 null 而不是空字符串

vue.js - 当 Vue 中第一个输入被填充时禁用第二个输入

javascript - Vue.js <transition-group> 仅在最后一个元素上应用动画

javascript - 如何使用 Django 获取正在 HTML 中呈现的对象的索引

javascript - 如何在 VueJs 中重用 ViewModel?

javascript - .vue 组件中的条件样式表