以编程方式触发列表项中的 @click 事件的等效项

Question

在项目列表中（类星体中的 q 列表）是否可以通过编程方式 select 列表中的特定项目，例如，通过按钮？

问题主要是以编程方式触发列表项中的@click 事件（或 select 事件，如果它存在于 Vue 或 Quasar 中）。

通过以下方式可以获得select的项目，但我认为，不知何故，我将不得不使用组件'el'

let itemToSelect = 2;

this.item = this.itens.find( (item) => {
     return item.id === itemToSelect                          
})

console.log(this.item);

已编辑

为了更好地说明我想要实现的目标： https://codepen.io/ijose/pen/vYEwazj

Answer 1

通常要触发在模板中呈现的按钮的点击，您在特定按钮上放置一个 ref 并像这样调用它：

模板


<button ref="button1" @click="alert"></button>

调用例如


mounted() {
    this.$refs.button1.click();
  },
  methods: {
    alert(){
      alert("hello");
    }
  }

以编程方式触发列表项中的 @click 事件的等效项

Programmatically trigger the equivalent of the @click event in a list item

list

vue.js

quasar