我的应用程序循环遍历蔬菜作物列表，并为每个作物显示疾病键和控制措施的链接。
对于其中一个作物（cropid=6），没有疾病键存在，我无法停止显示该特定链接。
我的代码相关部分如下：
<v-container fluid grid-list-lg>
<v-layout justify-center>
<v-flex xs12>
<h3>Diseases</h3>
<v-card
v-for="(disease,index) in diseases"
:key="index"
ripple
class="hand"
@click="navigateTo(disease.id)"
>
<v-container>
<v-layout fill-height>
<v-flex xs12 md8 lg6>
<span v-html="$t(disease.link)"></span>
</v-flex>
</v-layout>
</v-container>
</v-card>
</v-flex>
</v-layout>
</v-container>
我的数据部分如下：
diseases: [
{ link: "disease key", id: "k", path: "key" },
{ link: "disease controls", id: "d", path: "control" },
],
如果cropID=6，我该如何停止显示"disease key"链接？
谢谢/Tom
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
对于条件显示，您需要使用
v-if。假设disease.id类似于cropId，您可以使用以下代码：var app = new Vue({ el: '#app', data: { diseases: [{ link: "disease key", id: "k", path: "key" }, { link: "disease controls", id: "d", path: "control" }, ] } })<link href="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.min.css" rel="stylesheet"> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <script src="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.js"></script> <div id="app"> <v-container fluid grid-list-lg> <v-layout justify-center> <v-flex xs12> <h3>Diseases</h3> <v-card v-for="(disease,index) in diseases" :key="index" ripple class="hand" @click="navigateTo(disease.id)"> <v-container v-if="disease.id!='d'"> <v-layout fill-height> <v-flex xs12 md8 lg6> <span v-html="disease.link"></span> </v-flex> </v-layout> </v-container> </v-card> </v-flex> </v-layout> </v-container> </div>