Vuex: 알 수 없는 작업 유형:

Vuex: 알 수 없는 작업 유형:

저는 Vuex에서 작업을 발송하는 방법에 대해 문제가 있습니다.

지금은 앱을 만들고 Vuex를 사용하고 있습니다.
로그인에서 store/user.js의 vuex 서명 작업을 발송하고 싶습니다.vue, 하지만 작동하지 않습니다.저는 당신이 저에게 어떤 조언이든 해주길 바랍니다.

이제 앱의 디렉터리 구조입니다.

여기에 이미지 설명 입력

And the files which can contain problems are here:

index.js

import Vue from 'vue';
import Vuex from 'vuex';
import user from './modules/user'

Vue.use(Vuex);

const store = new Vuex.Store({
modules: {
    user
}
})

export default store;

user.js

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

const user = new Vuex.Store({

state: {
    current: null,
    name: 'John'
},
mutations: {
    setCurrent(state, payload) {
        state.current = payload
    }
},
actions: {
    signin({commit}, {name, password}) {
        axios.$post('http://localhost:3000/login', {name, password})
            .then((response) => {
                commit('setCurrent', response.data)
            })
        },  
   signout({commit}) {
        commit('setCurrent', null)
    } 
}
})

export default user;

Login.vue

<template>
  <v-container>
    <v-card>
      <v-card-title>
        Login
      </v-card-title>
      <v-card-text>
        <v-form>
          <v-text-field
            v-model="name"
            :counter="10"
            label="name"
            required
          ></v-text-field>
          <v-text-field
            v-model="password"
            :counter="10"
            label="password"
            required
          ></v-text-field>
          <v-btn
            class="mr-4"
            @click="submitLoginDatas()"
          >
            Login
          </v-btn>
        </v-form>
      </v-card-text>
    </v-card>
    {{ getName }}
    <v-row class="button">
      <v-col>
        <v-btn
          style="margin-top: 4px;"
          to="/signup"
        >
          Signup
        </v-btn>
      </v-col>
    </v-row>
  </v-container>
</template>

<script>
    export default {
    data() {
      return {
        name: '',
        password: ''
      }
    },
    methods: {
      async submitLoginDatas() {
        console.log('HI')
        console.log(this.$store.state.user.name)
        // ここまでは呼ばれてる
        // store自体も登録できている(下のgetNameから確認できる)
        await this.$store.dispatch("signin",
          {
            name: this.name, 
            password: this.password
          }
        )
      }
    },
    computed: {
      getName() {
        return this.$store.state.user.name
      }
    }
  }
</script>

내가 지금까지 확인한 것
·typo...ex.typo 액션을 다음과 같은 액션으로 지정합니다.
·어쨌든든...이제 저는 namespaid:user.js에서 true를 표현하지 않지만, 아래 코드를 사용하여 namespaid:user.js에서 true를 시도했습니다.하지만 그것은 작동하지 않았다.

this.$store.dispatch("user/signin", {
    name: this.name,
    password: this.password
})

・user.js is registered correctly in index.js or not
...getName() in computed in Login.vue is working, so maybe it's ok.

・whether actions and mutations are written as object, not function
...maybe it's correct.


Thank you for reading. My question is the reason why this error

[vuex] unknown action type: signin

발생 및 해결 방법에 대해 설명합니다.

다른 Vuex 내부에서 Vuex를 사용하려고 합니다. 이것은 작동하지 않습니다.Vuex 모듈은 Vuex 인스턴스 대신 일반 개체를 내보내야 합니다.변경해주세요modules/user.js되려고

import axios from 'axios'

export default {

state(): {
  return {
    current: null,
    name: 'John'
  }
},
mutations: {
    setCurrent(state, payload) {
        state.current = payload
    }
},
actions: {
    signin({commit}, {name, password}) {
        axios.$post('http://localhost:3000/login', {name, password})
            .then((response) => {
                commit('setCurrent', response.data)
            })
        },  
   signout({commit}) {
        commit('setCurrent', null)
    } 
}
}

언급URL : https://stackoverflow.com/questions/63574381/vuex-unknown-action-type