点击按钮内的v - 用于更改此属性vue js

-1

我想创建一个'添加朋友'按钮像Facebook一样。当点击这个“添加朋友”按钮时，它会变成“发送好友请求”按钮。我曾尝试以下方法不工作：点击按钮内的v - 用于更改此属性vue js

HTML：

<div v-for="(friend, index) in friends"> 
    <div v-if="friend.sentRequest"> 
     <button class='disabled'>Friend request sent</button> 
    </div> 
    <div v-else> 
     <button @click="addFriend(friend)">Add friend</button> 
    </div> 
</div>

脚本：

<script> 
    export default { 
     data() { 
      return { 
       friends: [], 
      } 
     }, 

     methods: { 
      addFriend(friend) { 
       friend.sentRequest = true; 
      } 
     } 
    } 
</script>

我需要帮助解决这个问题。提前致谢。

来源

2017-08-31 WahidSherief

测试此：'这$组（朋友， 'sentRequest'，真）''上addFriend（朋友）'方法。 – talkhabi

你可以使用像** this.friend.sentRequest = true; ** – Naveen

是工作像魅力..！但我在另一个地方应用了我的方法，几乎和这个正在工作的场景类似。为何我的方法在这里失败？ @ Damon.s – WahidSherief

当您要为现有对象定义属性时，应该使用this.$set(target, key, value)。

在这种情况下使用：

methods: { 
    addFriend(friend) { 
     this.$set(friend, 'sentRequest', true); 
    } 
}

来源

2017-08-31 12:46:41 talkhabi

点击按钮内的v - 用于更改此属性vue js

回答

相关问题