试图在vue js中使用axios向api添加用户输入，但出现错误？

//这是我的signupform.js，我有一个对象，其中有我的表单键

import Datepicker from 'vuejs-datepicker'
import store from '../../store';
export default {
  name: 'Signupform',
  components: {
    Datepicker,store
  },
  data() {
    return {
      enter_details:
        {
          username: '',
          email: '',
          contactNumber: '',
          firstName: '',
          lastName:'',
          dob: '',
          password: '',
          repeat_password: ''
        }


    }
  },
  methods:{
    addtoAPI() {

      this.$store.dispatch('addtoapi',this.enter_details)
    }
  }
};

//这是我的商店的行动

import vuex from 'vuex';
import axios from 'axios'
vue.use(vuex);

const store = new vuex.Store({
  actions: {

    addtoapi: ({commit}, enter_details) => {

      let newuser = {
        username: enter_details.username,
        email: enter_details.email,
        contactNumber: enter_details.contactNumber,
        firstName: enter_details.firstName,
        lastName: enter_details.lastName,
        dob: enter_details.dob,
        password: enter_details.password,
        repeat_password: enter_details.repeat_password,
      }
      console.log(newuser);
      axios.post('https://dev-api.mysc.io/int/api/v1', newuser)
        .then((response) => {
          console.log(response);
        })
        .catch((error) => {
          console.log(error);
        })
    }
  }
});

//现在我得到一个错误，即

Signupform.js?22e4:28 Uncaught TypeError: this.$store.dispatch is not a function
    at VueComponent.addtoAPI (Signupform.js?22e4:28)
    at boundFn (vue.esm.js?efeb:190)
    at invoker (vue.esm.js?efeb:2004)
    at HTMLButtonElement.fn._withTask.fn._withTask

我还遇到一个错误，当我尝试在浏览器上的vue上查看我的存储时，它显示“没有vuex存储”

请帮助我解决此错误，因为我已经

//这是我的main.js

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

Vue.config.productionTip = false

/* eslint-disable no-new */


export const bus = new Vue();


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

从“Vue”导入Vue
从“./App”导入应用程序
从“./路由器”导入路由器
从“./store”导入存储
Vue.config.productionTip=false
/*eslint禁用无新*/
export const bus=new Vue（）；
新Vue({
el:“#应用程序”，
路由器，
商店，
组件：{App}，
模板：“”
})

在你的商店里。js写下：

export default new Vuex.Store({
     //
});

而不是

export default({
     //
});

UPD：

您不需要将store作为组件包括在内：

// signupform.js file ...
components: {
    Datepicker,
    store // <--- this is unnessesary
},

按我

Uncaught ReferenceError:Vuex未在eval（actions.js？44d5:6）的Object../src/store/actions.js（app.js:2303）中定义。将其更改为

new Vuex.store（{…}）

。出现此错误是因为您在文件开头将vuex作为

vuex

导入，而不是

vuex

。我使用了“导出默认新vuex.Store”（{“仍然收到错误Signupform.js？22e4:28 Uncaught TypeError:this.$Store.dispatch不是VueComponent.addtoAPI（Signupform.js？22e4:28）中的函数）你能为你的商店添加全部代码吗？这个。$store对象包含什么？我会在我的答案中添加一个小演示，也许它会给你指出正确的方向。实际上这是一个动作，所以我在我商店的actions.js中写下这段代码，正如你所说，我已经给出了我的actions.js的全部代码