vuex存储中未定义ReferenceError状态

我的 vuex 商店看起来像这样,但打电话的时候 addCustomer 我明白了 ReferenceError: state is not defined :

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

export default new Vuex.Store({
  state: { customers: [] },
  mutations: {
    addCustomer: function (customer) {
      state.customers.push(customer); // error is thrown here
    }
  }
});

添加客户

<template>
    <button class="button" @click="addCustomer">Add Customer</button>
</template>

这就是 添加客户 :

<script>
  export default {
    name: "bootstrap",
    methods: {
      addCustomer: function() {
        const customer = {
          name: 'Some Name',
        };

        this.$store.commit('addCustomer', customer);
      }
    }
  }
</script>