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

Question

In a list of items (in quasar a q-list) is it possible to programmatically select a particular item from the list, for example, from a button?

The problem is mainly to programmatically trigger the equivalent of the @click event in the list item (or select event if it exists in Vue or Quasar).

In the following way it is possible to obtain the item to select, but I think that, somehow, I will have to use the 'el' of the component

let itemToSelect = 2;

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

console.log(this.item);

EDITED

To better illustrate what I want to achieve: https://codepen.io/ijose/pen/vYEwazj

Answer 1

Usually to trigger a click of a button that is rendered in the template, you put a ref on the specific button and call it like this:

template

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

the call for example

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