vuex 解决报错this.$store.commit is not a function的方法

npm install vuex --save

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

// 告诉 vue “使用” vuex
Vue.use(Vuex)

// 创建一个对象来保存应用启动时的初始状态
// 需要维护的状态
const store = new Vuex.Store({
 state: {
  // 放置初始状态 app启动的时候的全局的初始值
  bankInf: {"name":"我是vuex的第一个数据","id":100,"bankName":"中国银行"}
 }
})
// 整合初始状态和变更函数，我们就得到了我们所需的 store
// 至此，这个 store 就可以连接到我们的应用中
export default store

import Vue from 'vue'
import App from './App'
import router from './router'
import store from './../store/index'

/* eslint-disable no-new */
new Vue({
 el: '#app',
 router,
 store,
 template: '<App/>',
 ponents: { App }
})

export default {
 ...
 puted: {
  bankName() {
   return this.$store.state.bankInf.bankName;
  }
 },
 ...
}

<div class="bank">
  <list-header :headerData="bankName"></list-header>
  04银行详情页面
  <input name="" v-model="textValue">
  <button type="button" name="获取数据" @click="newBankName"></button>
</div>

export default {
 ...
 puted: {
  bankName() {
   return this.$store.state.bankInf.bankName;
  }
 },
 methods: {
  newBankName: function() {
   this.$store.mit('newBankName', this.textValue)
  }
 }
 ...  
}

const store = new Vuex.Store({
 state: {
  // 放置初始状态 app启动的时候的全局的初始值
  bankInf: {"name":"我是vuex的第一个数据","id":100,"bankName":"中国银行"},
  count:0
 },
 mutations: {
  newBankName(state,msg) {
   state.bankInf.bankName = msg;
  }
 }
})

npm rm vuex --save

npm install vuex --save