时间戳

首页 > 解决方案 > 如何在Vue中以动态形式向特定输入添加更改事件？

vue.js - 如何在Vue中以动态形式向特定输入添加更改事件？

问题描述

我想以动态形式将更改事件添加到两个输入。目前，每个输入都会触发更改事件。有没有办法指定输入“共享”和“最近”将触发更改事件，但不会触发其他事件？

 <v-input
        v-for="item in state.items"
        :key="item.id"
        @change='triggerChange'
      >
 </v-input>
 state: () => ({
  items: [
    { text: 'My Files', id: '1'},
    { text: 'Shared', id: '2' },
    { text: 'Starred', id: '3' },
    { text: 'Recent', id: '4' },
    { text: 'Offline', id: '5' },
    { text: 'Uploads', id: '6' },
    { text: 'Backups', id: '7' },
  ],
})
   const triggerChange = () => {
  <something happens>
   }

标签： vue.jsvuetify.jsvue-composition-api

解决方案

为了使模板中的逻辑最小化，我只需在事件处理程序中检查这个条件：

<v-input
        v-for="item in state.items"
        :key="item.id"
        @change='triggerChange(item)'
      >
 </v-input>

// ...

const triggerChange = (item) => {
  if(!(item.id == 2 || item.id == 4)) { return}
}

推荐阅读