source

vuejs에서 vuex(디스패치) 오류 422가 발생하였습니다.

goodcode 2022. 8. 31. 22:38
반응형

vuejs에서 vuex(디스패치) 오류 422가 발생하였습니다.

에러가 발생했습니다.

422 (Unprocessable Content)

데이터를 레지스터 형식으로 올리려고 했을 때

이건 제 계산대에 있어요.표시하다

  methods: {
    register() {
      this.$store.dispatch('register', {
        firstname: this.firstname,
        lastname: this.lastname,
        email: this.email,
        password: this.password,
      });
    },
  },
};

그리고 나의 vuex에서는

  actions: {
    register(credentials) {
      const requestOptions = {
        method: 'POST',
        headers: { 'content-type': 'application/json' },
        dataType: 'json',
        body: JSON.stringify(credentials),
      };
      console.log(credentials);
      return fetch('http://localhost/api/users', requestOptions)
        .then((response) => {
          return response.json;
        })
        .catch((err) => console.log(err.message));
    },
  }

내가 어디서 틀렸는지 아는 사람?대단히 고맙습니다

요청이 좋으면 두 번 다시 돌아오지 마세요.

  actions: {
    register(credentials) {
      const requestOptions = {
        method: 'POST',
        headers: { 'content-type': 'application/json' },
        dataType: 'json', // not needed 
        body: JSON.stringify(credentials),
      };
      console.log(credentials);
      return fetch('http://localhost/api/users', requestOptions) // first time
        .then((response) => {
          return response.json; // second time
        })
        .catch((err) => console.log(err.message));
    },
  }

비동기/대기도 사용합니다.하고 싶다

  actions: {
    async register(credentials) {
    
      const requestOptions = {
        method: 'POST',
        headers: { 'content-type': 'application/json' },
        dataType: 'json',
        body: JSON.stringify(credentials),
      };
    
      const res = await fetch('http://localhost/api/users', requestOptions);
    }

    return res.json();
  }

그리고 그 안에Register.vue

  methods: {
    register() {
      this.$store.dispatch('register', {
        firstname: this.firstname,
        lastname: this.lastname,
        email: this.email,
        password: this.password,
      }).then(data => {
        console.log(data)
      }).catch((err) => console.log(err.message));
    });
  },
};

try/cache 등에 넣을 수도 있습니다.당신 마음대로 하세요.

서류를 확인해봐, 잘 설명했어.

언급URL : https://stackoverflow.com/questions/70569003/got-error-422-with-vuex-dispatch-in-vuejs

반응형