Axios - cannot change variable data value

Question

I tried to change the variable data using axios, i am using vue-axios and vue cli 3.

This is the code:

const qs = require('qs')
export default {
  name: 'Home',
  data: function () {
    return {
      email: null,
      errEmail: false,
      baseUrl: 'https://www.example.com/isemail.php'
    }
  },
  methods: {
    next: function () {
    },
    err: function () {
      this.axios.post(this.baseUrl + 'functions/isEmail.php', qs.stringify({
        value: this.email
      }))
        .then(function (resp) {
          this.errEmail = true
        })
    }
  }
}

<div v-if="errEmail">Target Success</div>

Actually i am trying change the errEmail variable depend on the server callback like this:

this.errEmail = resp.data.isemail

but using constant seems not working too.

You need to use an arrow function for the then() callback, or this inside the function will refer to the function itself, not your Vue app context. — user5734311
– user5734311, Commented Jul 7, 2020 at 11:22

Raffobaffo · Accepted Answer · 2020-07-07 11:15:47Z

4

Change this

.then(function (resp) {
  this.errEmail = true
})

to this

.then((resp) => {
  this.errEmail = true
})

Or manually bind this

   .then(function (resp) {
      this.errEmail = true
    }.bind(this))

answered Jul 7, 2020 at 11:15

Raffobaffo

2,90611 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Axios - cannot change variable data value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related