vue3.0----store初始化

最新推荐文章于 2025-05-07 15:25:56 发布

智慧2021

最新推荐文章于 2025-05-07 15:25:56 发布

阅读量2.1k

点赞数 1

分类专栏： vue3.0

本文链接：https://blog.youkuaiyun.com/weixin_38687522/article/details/117562666

版权

vue3.0 专栏收录该内容

36 篇文章

订阅专栏

这篇博客介绍了如何使用Vuex进行状态管理，包括初始化state、同步修改state的mutations以及异步处理action。示例展示了如何创建store，定义setDataList方法，并通过actions的asyncDataList异步提交mutation来更新数据列表。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

import { createStore } from 'vuex'

export default createStore({
 
  state: {
     // 初始化状态
    dataList:[]
  },
  mutations: {
    //同步修改state 都是方法
    // 第一个参数 state 第二个参数，需要修改的值
    setDataList(payload){
      state.dataList = payload
    }
  },
  actions: {
    // 异步提交mutation
    // 第一个参数， store 第二个参数是修改的值
    asyncDataList(store, params){
      //commit来调用mutation，actions里方法不可以直接修改state,store里只有mutation可以修改state
      // commit 第一个参数是所需要调用 的mutations的方法，params是修改的值
      store.commit('setDataList', params) 
    }
  },
  modules: {
    // 模块化
  }
})