programing

알 수 없는 작업 유형: currentUser/loginUser

newsource 2022. 8. 14. 12:16

알 수 없는 작업 유형: currentUser/loginUser

laravel/vuejs/vuex를 사용하여 로그인 폼을 작성하려고 하는데 작업을 실행하려고 하면 오류가 발생함컴포넌트에서 모듈에서 vuex 작업을 실행하려고 하는데 알 수 없는 작업 유형 currentUser/loginUser가 표시됩니다.
login Form 입니다.

            <template>
     <div>
 <div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" v-model="user.email" id="exampleInputEmail1" aria- 
describedby="emailHelp">

    </div>
    <div class="form-group">
  <label for="exampleInputPassword1">Password</label>
  <input type="password" class="form-control" v-model="user.password" 
  id="exampleInputPassword1">
  </div>
  <div class="form-group form-check">
 <input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Check me out</label>
</div>
 <button type="submit" @click="login"    class="btn btn-primary">Submit</button>
 < /div>
</template>
  <script>
export default{
data:()=>({
  user:{
      email:"",
      password:""
}
}),
 methods: {
       login(){
this.$store.dispatch('currentUser/loginUser',this.user);
 }  
 }
 }



  </script>

및 이 currentUser.js:

import axios from "axios";

 const state ={
   user:{

  }

  };
 const getters= {};
 const actions = {
  loginUser({},user){
   axios.post("/login",{
       email: user.email,

       password: user.password
   })
   .then(response=>{
       console.log(response.data);
   })
 }
 };
const mutations={};

export default{
namespaced:true,
 state,
 getters,
actions,
mutations
}

나는 내 코드에서 같은 문제에 직면했었다.

가장 먼저 살펴봐야 할 것은 오타가 있는지 여부입니다.

다음으로 모듈을 등록했는지 확인해야 합니다.

당신의 경우 모듈이 등록되지 않았습니다.이렇게 하는 거예요.

작성한 훅(사용하는 버전에 따라 공식 문서에서 어떤 훅이 있는지 확인할 수 있습니다)에는 다음과 같이 모듈을 등록합니다.

created () {
  // Register Module EmployeeManagement Module
  if (!moduleEmployeesManagement.isRegistered) {
    this.$store.registerModule('employeesManagement', moduleEmployeesManagement)
    moduleEmployeesManagement.isRegistered = true
  }
}

고객님의 경우 코드에도 이 내용을 추가합니다.

import currentUser from "./modules/currentUser"
...// rest of your code
...// under the methods
created () {
  // Register Module Login
  if (!currentUser.isRegistered) {
    this.$store.registerModule('currentUser', currentUser)
    currentUser.isRegistered = true
  }
}

이것으로 당신의 문제가 해결될 것 같습니다.이건 나한테 효과가 있었어.

힌트:

  • 게시할 때 코드 포맷
  • // 오류에 대해 표시되는 항목만 최소로 유지합니다.
  • 필요한 것을 추가합니다(이 경우 Import를 생략하고 지금 편집하여 추가할 수 있습니다).
  • (물건의) 사용을 생략하다loginUser이렇게 밑줄을 치다loginUser(_,data)
  • 새 파일에서 getters 돌연변이 등을 분리하여 메인 모듈 파일로 가져옵니다.
  • 보다 유지보수가 용이한 코드를 얻기 위해 더 많은 코딩 표준을 참조할 수 있습니다.

언급URL : https://stackoverflow.com/questions/60642702/unknown-action-type-currentuser-loginuser