我只是想知道怎么做.js方式，现在我可以在单个项目上切换active类，当我单击其他项目时，active类仍然出现在前一个项目上，以下是我的设置:
FileOne.vue (Parent component)
// Say that I have 5 Items I am rendering here:
<template>
<ul v-for="item in items">
<my-list-item :item-title="article.title"
:item-content="article.content"> </my-list-item>
</ul>
</template>
<script>
import Items from './FileTwo'
export default {}
</script>
fileTwo.vue (Child components)
// When I click each Item the `active` class should be applied to the current Item and removed from previous item:
<template>
<li :class="{'active': isRowActive}" @click.stop="toggleRowActive">
<h1>{{articleTitle}}</h1>
<p>{{itemContent}}</p>
</li>
</template>
<script>
export default {
name: 'my-list-item',
data: function () {
return {
isRowActive: false,
}
},
props: {
articleTitle: String,
articleContent: String,
},
toggleRowFn() {
this.isRowActive = !this.isRowActive;
this.showBtnReadContent = true;
},
}
</script>