vue 状态管理vuex Mutation 加传递参数用法

index.js写法

import { createStore } from "vuex";

const store=createStore({

    state:{

        count:100

    },

    getters:{

        compower(state){

            return (id)=>state.count*id

        }

    },

    mutations:{

        add(state,n) {

            state.count+=n

       }

    },

    actions:{},

    modules:{}

})

export default store

 

vue写法

<script>

  export default {

    methods: {

      increment(t){

            // 在组件中通过commit触发mutations中的函数

            this.$store.commit("add",8)

        },

    }

  }

</script>

<template>

  <div>

    <h1>APP</h1>

 

<p>{{ $store.state.count }}</p> <br>

<p>{{ $store.getters.compower(5)}}</p><br>

<button @click="increment(8)">++</button>

</template>

<style scoped>

</style>