Prezenta handler, Reacționează Axios: Post și a Obține în același handler

Question 1

Eu sunt încercarea de a crea o aplicație web care încarcă fișiere și atașat utilizatorului curent la dosar model ca o cheie externă. Pentru unii motiv, la cerere, a fost distrus, dar inițial a obține informațiile necesare.

  handleSubmit = (e) => {
    e.preventDefault();
    axios.get('http://127.0.0.1:8000/core/current_user/', {
      headers: {
        Authorization: `JWT ${localStorage.getItem('token')}`,
      }
    }).then((user) => {

      this.state.creator = user.data;
      console.log(this.state.creator);
    })  
    console.log(this.state.creator);
    let form_data = new FormData();
    form_data.append('creator', this.state.creator);
    form_data.append('file', this.state.file);
    form_data.append('title', this.state.title);
    form_data.append('description', this.state.description);
    axios.post('http://localhost:8000/core/posts/', form_data, {
      headers: {
        'Content-Type': 'multipart/form-data',
        Authorization: `JWT ${localStorage.getItem('token')}`,
      }
    }).then(res => {
        console.log(res.data);
      }).catch(err => console.log(err))
  };

1 consola revine utilizatorului informații, dar a 2-a consola returnează null. Orice ajutor va fi apreciat foarte mult.

Question 2

Dvs. then declarație după original get se termină pe linia 11, iar restul de cod este în afara de asta.

Cu codul asincron, codul afara then blocul va continua să ruleze în timp ce este în așteptare pentru un răspuns, așa că this.state.creator nu au fost stabilite încă. Apoi se va reveni la codul din interiorul then bloc o dată promisiunea rezolvă.

Aveți nevoie pentru a muta toate de-al doilea bloc de cod în interiorul intial then bloc este executat doar o dată un răspuns la original get cererea s-a întors:

handleSubmit = (e) => {
  e.preventDefault();
  axios
    .get('http://127.0.0.1:8000/core/current_user/', {
      headers: {
        Authorization: `JWT ${localStorage.getItem('token')}`,
      },
    })
    .then((user) => {
      this.state.creator = user.data;
      console.log(this.state.creator);
      let form_data = new FormData();
      form_data.append('creator', this.state.creator);
      form_data.append('file', this.state.file);
      form_data.append('title', this.state.title);
      form_data.append('description', this.state.description);
      axios
        .post('http://localhost:8000/core/posts/', form_data, {
          headers: {
            'Content-Type': 'multipart/form-data',
            Authorization: `JWT ${localStorage.getItem('token')}`,
          },
        })
        .then((res) => {
          console.log(res.data);
        })
        .catch((err) => console.log(err));
    });
};

Mario Petrovic · Answer 1 · 2021-11-24T00:46:59

Dvs. then declarație după original get se termină pe linia 11, iar restul de cod este în afara de asta.

Cu codul asincron, codul afara then blocul va continua să ruleze în timp ce este în așteptare pentru un răspuns, așa că this.state.creator nu au fost stabilite încă. Apoi se va reveni la codul din interiorul then bloc o dată promisiunea rezolvă.

Aveți nevoie pentru a muta toate de-al doilea bloc de cod în interiorul intial then bloc este executat doar o dată un răspuns la original get cererea s-a întors:

handleSubmit = (e) => {
  e.preventDefault();
  axios
    .get('http://127.0.0.1:8000/core/current_user/', {
      headers: {
        Authorization: `JWT ${localStorage.getItem('token')}`,
      },
    })
    .then((user) => {
      this.state.creator = user.data;
      console.log(this.state.creator);
      let form_data = new FormData();
      form_data.append('creator', this.state.creator);
      form_data.append('file', this.state.file);
      form_data.append('title', this.state.title);
      form_data.append('description', this.state.description);
      axios
        .post('http://localhost:8000/core/posts/', form_data, {
          headers: {
            'Content-Type': 'multipart/form-data',
            Authorization: `JWT ${localStorage.getItem('token')}`,
          },
        })
        .then((res) => {
          console.log(res.data);
        })
        .catch((err) => console.log(err));
    });
};

Prezenta handler, Reacționează Axios: Post și a Obține în același handler

Problema

Cel mai bun răspuns

În alte limbi

Această pagină este în alte limbi

Popular în această categorie

Întrebări frecvente în această categorie