此问题已在此处有答案:
Vuetify 3 change event in v-select(1个答案)
2天前关闭。
我正在使用vue 3,我不知道为什么我不能看v-select的变化
有人能帮忙吗多谢了
我尽力了
//test
Ex 1 :<VSelect
v-model="test"
:items="items_status"
@update:data.status="changeSelecterStatus"
@input="changeSelecterStatus"
@change="changeSelecterStatus"
on-change="changeSelecterStatus"
v-on:change="changeSelecterStatus"
v-on:input="changeSelecterStatus"
v-change="changeSelecterStatus()"
item-title="state"
item-value="abbr"
label="Select"
persistent-hint
return-object
single-line
/>
只有v-change可以工作,但是它只在changeSelecterStatus()
和not working
以及changeSelecterStatus
的情况下工作如果我使用v-change=“eventMethod()“它会给予我一堆事件,因为在初始化组件时它已经加载了数据更改API所以当我什么都不做的时候,它已经运行了x2,我拥有的总数据的总事件。这里我使用选择器来处理for循环生成的多列数据,所以每次我改变任何选择器时,它都会给予我一系列的事件,执行次数=页面上选择器的总数
Ex 2: <VCol
v-for="data in datas"
:key="data.id"
>
<VSelect
v-model="data.status"
:items="items_status"
@update:data.status="changeSelecterStatus"
@input="changeSelecterStatus"
@change="changeSelecterStatus"
on-change="changeSelecterStatus"
v-on:change="changeSelecterStatus"
v-on:input="changeSelecterStatus"
v-change="changeSelecterStatus"
item-title="state"
item-value="abbr"
label="Select"
persistent-hint
return-object
single-line
/>
//same
<v-select v-model="data.status"
@update:data.status="changeSelecterStatus"
@input="changeSelecterStatus"
@change="changeSelecterStatus"
on-change="changeSelecterStatus"
v-on:change="changeSelecterStatus"
v-on:input="changeSelecterStatus"
v-change="changeSelecterStatus()"
:items="items_status" item-title="state" item-value="abbr" label="Select" return-object single-line>
<template v-slot:selection="{ item }">
{{ getTextFromCodeStatus(item) }}
</template>
<template #item="{ item, props }">
<v-list-item v-bind="{ ...props, title: undefined }">
{{ item.title }}
</v-list-item>
</template>
</v-select>
changeSelecterStatus: function(){
console.log("task");
},
v-change="changeSelecterStatus()"
-> onload component : return task(data.lenght*2 time)
-> try to choose an option : return task(data.lenght*1 time)
更新:似乎像v-change可以正常工作,如果它可以确定正确的数据的基础上的数据.状态和关键是其data.id,因为函数的次数是运行=选择器的数量与v-model=“v-model的选择器”
Ex1 -> load component : return 1 tỉme because 'test' specified at default data does not have to be loaded from the api
Ex2
-> onload component : return task(data.lenght*2 time)
-> try to choose an option : return task(data.lenght*1 time)
2条答案
按热度按时间hc8w905p1#
根据Vuetify库,我们不能期望触发更改事件。
VSelect
你可以在下面的VuetifyPlayground找到相同的。
https://play.vuetifyjs.com/#eNqlVE1v4jAQ/SsjXwpSPhbYU5ZWrPgJu+oFc3CTAbxNbMt2sqoQ/33HdmCB9lCpyiEznjfz5j1H2RzZT2OKoUdWsaXHzrTC4xNXAMshF8bEEJbPa93CkO+0feSsEV6AVBDejjOoXvFtPC5kw1nqCV2/sMXajylAfZDGXbJWvGBLfb/Rean2nHHFfXiIqNNNrMWZzgvfE9G5s5K0qLswhuR/cdUbOsYqTngWbY8E1CpG64NQe7xgn5bluOGosgwyk/jyrH5ZXrlCqautNB4c+j6UZWe09XAEizs4wc7qDh7IzocArrVyPtkEjwEx2RxlU8Esg6QphlFAtZll82yxPWUQIPMMLhCKP4IsriAU30K20x9BBle7XtVeagU3FkyGKRwDIGyoWyxavZ9wFhGQDGyAswyGKVenYEKSTYJZxpLmvBOm+OO0oi8nzuJjgS6jStPDGXkRcs4O3htXlWXdKGqjy5GDLRT6UpmuXBGstL3yssO80d1qUSyKb7lozUEUs3nZSOev6wW6Ln+x+q9DS9No1Ss+L3dvn+AckUQ1K2bfE8V4ltO36QLHu9klEQ5oc4uqQYv2s9ru2j7Ud4d5pzGsQZdxoitopXp1d+7XLjq/OW/7NfFxWhi1TYxr3Z3/E+yUsdv9qZ4Gse0/q/5syg==
rqenqsqc2#
没有本机
v-change
Vue Directive但它起作用了,因为你有
做着同样的事情:
@
是v-on
的快捷方式,因此@change
=v-on:change
v-change
和on-change
不起作用,不执行任何操作。把这些都换掉
与
这足以捕获
onChange
事件。