大家好，我目前正在為我的公司開發一個監控應用程式。所以我試圖在表中使用 V-if 和 V-for 我的代碼如下所示：
<tbody v-for="server in servers" :key="server.Id">
<tr v-if="server.Show == true">{{DATA}}</tr>
如果您單擊左側的紅眼，您可以隱藏服務器，但它會留下不應該做的事情。如果我調整視窗大小，它會更正它。有沒有更好的方法將我的資料帶入 Tablebox，因為現在我正在為每個服務器創建一個新的 tablebody
我還是一名學生，對 VUE 還是很陌生，所以我希望有人能給我解釋為什么會這樣。
編輯：拼寫和更多資訊
uj5u.com熱心網友回復：
我應該在模板中回圈服務器并隱藏里面的行
<tbody>
<template v-for="(server, index) in servers">
<tr :key="server.Id" v-if="server.Show">{{DATA}}</tr>
<td>
<img src="../assets/eye.png" @click="HideServer(server,index)" />
</td>
</tr>
</template>
</tbody>
uj5u.com熱心網友回復：
如果我理解你，你想在沒有 tbody 標簽的情況下做同樣的事情嗎？在這種情況下，您可以將 tbody 替換為模板標簽，該標簽不會被渲染，它與 make v-for 和 v-if 在同一行相同。
<template v-for="server in servers">
<tr v-if="server.Show == true" :key="server.Id">{{DATA}}</tr>
uj5u.com熱心網友回復：
嘗試使用索引來修改相應的專案：
<tbody v-for="(server,index) in servers" :key="server.Id">
<tr v-if="server.Show == true">.....
<img src="../assets/eye.png" @click="HideServer(server,index)" /></td>
HideServer(server,index) {
this.servers[index]={...server,Show : false}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/417275.html
標籤：
下一篇：更改單選按鈕更改的類