在Vue中axios请求后更新关注状态

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

一个基本示例：

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

Answer 2

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 3

快速方式：

<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;
   })
}