我想知道如何在单击按钮后将其更改为禁用,但数据来自其余 api,因此我只想禁用该列表项上的按钮,而不是所有按钮。我看不到在 VueJS 中在哪里执行此操作。
这是addItem button哪个代码是:
<button
type="button"
class="btn btn-primary btn-lg mb-3 float-right"
v-on:click="addItem(result)"
>
<font-awesome-icon icon="plus"/>
</button>
列表组件
<template>
<div class="mb-5 container">
<button type="button" class="btn btn-primary mt-2 mb-2 btn-block">
My List
<span class="badge badge-light">{{List.length}}</span>
</button>
<ul class="list-group" v-for="(result, index) in List" :key="index">
<li class="list-group-item">
<b>{{result.collectionName}}</b>
<h6 class="mt-0">{{result.artistName}}</h6>
<p class="mt-0">{{result.primaryGenreName}}</p>
</li>
</ul>
<ul>
</ul>
</div>
</template>
<script>
export default {
props: [
'List',
],
};
</script>
所以这个想法是用户可以向列表组件添加一个项目,但显然他们不能继续添加该项目,所以这就是为什么我需要在点击后禁用该按钮。
喵喵时光机
相关分类