Uncaughed Type Error: 이거.$store.commit은 함수가 아닙니다.

Uncaughed Type Error: 이거.$store.commit은 함수가 아닙니다.

데이터를 vuex 변환에 커밋하려는 vue 메서드가 있는데, 어떤 이유로 Uncaught TypeError: this가 계속 표시됩니다.$store.commit은 함수가 아닙니다.

목록 항목을 클릭하고 함수를 호출하면 오류가 발생합니다.

---

sample.vue

<li class="tabs-title" v-for="item in filteredItems" v-on:click="upComponents" :key="item.initials" >

export default {
  data() {
    return {
      search: null,
    };
  },
  computed: {
    filteredItems() {
      const coins = this.$store.state.coin.coin;
      if (!this.search) return coins;

      const searchValue = this.search.toLowerCase();
      const filter = coin => coin.initials.toLowerCase().includes(searchValue) ||
          coin.name.toLowerCase().includes(searchValue);

      return coins.filter(filter);
    },
  },

  methods: {
    upComponents(item) {
      this.$store.commit('updatedComp', item);
    },
  },

  mounted() {
    this.tabs = new Foundation.Tabs($('#exchange-tabs'), {
      matchHeight: false,
    });
  },
  destroyed() {
     this.tabs.destroy();
  },
};

이것은 변이를 선언하는 store.js 파일입니다.

import Vue from 'vue';
import Vuex from 'vuex';
import coin from '../data/system.json';

Vue.use(Vuex);

export default {
  state: {
   coin,
   selectedCoin: 'jgjhg',
  },
  mutations: {
    updatedComp(state, newID) {
     state.selectedCoin.push(newID);
    },
  },
  getters: {
    coin: state => state.coin,
  },
};

main.js, 여기서 Vue 앱을 선언합니다.

import jQuery from 'jquery';
import Vue from 'vue';
import App from './App';
import router from './router';
import store from './store/store';


window.jQuery = jQuery;
window.$ = jQuery;

require('motion-ui');
require('what-input');
require('foundation-sites');


new Vue({
  el: '#app',
  store,
  router,
  template: '<App/>',
  components: { App },
});

현재 작업 중인 페이지는 모든 컴포넌트를 로드하는 페이지입니다.

<template>
  <div class="grid-container">
    <div class="grid-x">
      <div >
       <headline-exchange></headline-exchange>
       ...
      </div>
    </div>
  </div>
</template>



<script>
import Headline from './molecules/Headline';

export default {
  components: {
   'headline-exchange': Headline,
  },
};

</script>

를 작성하지 않습니다.Vuex스토어. 스토어 속성을 정의하는 오브젝트밖에 없습니다.

변경하다store.js되려고

export default new Vuex.Store({
  state: { ... },
  mutations: { ... }, 
  // etc
})

https://vuex.vuejs.org/guide/ #the-module-store를 참조하십시오.

언급URL : https://stackoverflow.com/questions/46416012/uncaught-typeerror-this-store-commit-is-not-a-function