vuex的五个属性

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化，Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的 timetravel 调试、状态快照导入导出等高级调试功能。

我们提供的服务有：成都做网站、成都网站设计、微信公众号开发、网站优化、网站认证、滦州ssl等。为数千家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务，是有科学管理、有技术的滦州网站制作公司

下面是 Vuex 的五个核心属性：

1. State

State 是 Vuex 的基础，用于存储应用的状态，每个 Vuex 实例都有一个单一的 state 对象，该对象以模块为组织形式，每个模块包含一组属性。

const state = {
  count: 0,
  info: 'This is global state'
}

2. Getters

Getters 类似于 Vue 的计算属性，用于从 state 中派生出一些状态，对一个数组进行过滤并计数：

const getters = {
  doneTodosCount: (state) => {
    return state.todos.filter(todo => todo.done).length
  }
}

3. Mutations

Mutations 是唯一更改 store 中状态的方法，每个 mutation 都有一个字符串类型的事件类型和对应的处理函数，执行 mutation 时会调用对应的处理函数来改变 state 的状态：

const mutations = {
  increment (state) {
    state.count++
  }
}

4. Actions

Actions 类似于 mutations，不同之处在于：Actions 提交的是 mutation，而不是直接变更状态，Actions 可以包含任意异步操作，因此可以在其中进行 API 请求等操作。

const actions = {
  increment ({ commit }) {
    setTimeout(() => {
      commit('increment')
    }, 1000)
  }
}

5. Modules

Modules 可以将 store 分割成多个模块（module），每个模块拥有自己的 state、getter、mutation、action、甚至是嵌套子模块——从上至下进行同样方式的分割：

const moduleA = {
  state: () => ({ ... }), // 定义该模块状态
  mutations: { ... }, // 同步操作
  action: { ... } // 异步操作
}
const store = new Vuex.Store({
  modules: {
    a: moduleA
  }
})

本文名称：vuex的五个属性
URL地址：http://www.csdahua.cn/qtweb/news18/513868.html

网站建设、网络推广公司-快上网，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 快上网