обновить статус отслеживания после запроса axios в Vue

Question

Мне нужно обновить после подписки axios кнопку «следовать», чтобы отменить подписку.

    <template>
        <div v-if="isnot">
        <a href="#"  @click.prevent="unfellow" v-if="isfollowing" >unFellow</a>
        <a href="#" @click.prevent="fellow"  v-else >Fellow</a>
        </div>
    </template>

Мои методы

            fellow () {
                axios.post(`/@${this.follower}/follow/`)
            },
            unfellow () {
                axios.post(`/@${this.follower}/unfollow/`)
            },
        }

Answer 1

В Axios есть ряд методов, которые вы можете выполнить после получения ответа. В случае пост-звонка ваша структура может выглядеть примерно так:

axios.post(YOUR ROUTE)
  .then(function (response) {
    //executes after getting a successful response
    // here you can change your 'isfollowing' variable accordingly

  })
  .catch(function (error) {
    //executes after getting an error response
  });

Answer 2

Быстрый путь:

<template>
    <div v-if="isnot">
        <a href="#"  @click.prevent="fellowUnfellow" v-if="isfollowing" >{{isfollowing ? "unFellow" : "Fellow"}}</a>
    </div>
</template>

fellowUnfellow () {
   axios.post(`/@${this.follower}/follow/`).then(function (r) {
       this.isfollowing = !this.isfollowing;
   })
}

Answer 3

Базовый пример:

fellow () {
     var self = this;
     axios.post(`/@${this.follower}/follow/`)
     .then(function (response) {
          self.isfollowing = true;
     })
     .catch(function (error) {
          console.log( error.response.data);
     });
},