我有一個 vuetify 資料表，原來的解決方案是使用 v-for 為每一列動態分配搜索文本欄位，然后實作多過濾器。以下是我的解決方案：
<template v-for="(header, i) in columns" v-slot:[`header.${header.value}`]="{ }">
{{ header.text }}
<v-text-field :key="i"
v-model="multiSearch[header.value]"
type="text"
:placeholder="header.value"
prepend-inner-icon="mdi-magnify"
></v-text-field>
</template>
問題是每當用戶單擊特定列的文本欄位時，排序功能也會同時運行。我在以下具有相同行為的筆上有一個微型解決方案。我試圖在模板標簽后放一個 div，但還是一樣。請看一下。任何幫助，將不勝感激。 代碼筆
uj5u.com熱心網友回復：
用 DIV 包裹文本欄位并附加并防止 CLICK 事件冒泡：
<template v-for="(header, i) in columns" v-slot:[`header.${header.value}`]="{ }">
{{ header.text }}
<div @click.stop>
<v-text-field :key="i"
v-model="multiSearch[header.value]"
class="pa"
type="text"
:placeholder="header.value"
prepend-inner-icon="mdi-magnify"
></v-text-field>
</div>
</template>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/353952.html
標籤：Vue.js vuetify.js vuetify-数据表
上一篇：VueJSv3、Vuex和CompositionAPI以及輸入欄位上的v-model
下一篇：使用在模板內的方法中定義的變數