• vuex中 mutation和action的区别和使用


    utations 类似于事件,用于提交 Vuex 中的状态 state

    action 和 mutations 也很类似,主要的区别在于mutations 只能是同步操作,,action 可以包含异步操作,而且可以通过 action 来提交 mutations

    mutations 有一个固有参数 state,接收的是 Vuex 中的 state 对象

    action 也有一个固有参数 context,但是 context 是 state 的父级,包含 state、getters

    Vuex 的仓库是 store.js,将 axios 引入,并在 action 添加新的方法

    分发调用action:

    this.$store.dispatch('action中的函数名',发送到action中的数据)

    在组件中提交 Mutation:
    this.$store.commit(“mutation函数名”,发送到mutation中的数据)

    在action中提交mutation :

    const store = new Vuex.Store({
      state: {
        count: 0
      },
      mutations: {
        increment (state) {
          state.count++
        }
      },
      actions: {
        increment (context) {    //官方给出的指定对象, 此处context可以理解为store对象
          context.commit('increment');
        }
      }
    })
    
    // 第一种写法简写形式
      const actions = {
        action的函数名({commit}) { 
          commit(“mutation函数名”, value);   //调用mutation中的函数
          //此处value可以是对象,可以是固定值等
        }
      }
      // 第二种形式
      const actions = {
        action中的函数名(context) {
          //context 官方给出的指定对象, 此处context可以理解为store对象
          context.commit(“mutation函数名”, value);     //调用mutation中的函数
        }
      }
    
    
  • 相关阅读:
    Java帮助文档的生成
    Java内部类
    Java中利用标签跳出外层循环break
    【转】你真的了解word-wrap和word-break的区别吗?
    Office/Access 2013 扩展支持xbase/DBF 文件
    调用cmd.exe执行pdf的合并(pdftk.exe)
    input 数字输入控制(含小数)
    iis7.5 发布mvc出错的解决办法
    table中超过长度的列,显示省略号
    本地图片的预览和上传
  • 原文地址:https://www.cnblogs.com/panghu123/p/11747285.html
Copyright © 2020-2023  润新知