Using @click in select options - Vue.js 2

Viewed 26783

I'd like to use @click in select options.

So far I have:

<button @click="sortBy('name')">sort by name</button>
<button @click="sortBy('price')">sort by price</button>

and it works, however when I insert it into option tag, it stopped working.

<select name="sortBy" id="sortBy">
  <option value="sort">sort By</option>
  <option @click="sortBy('name')">name</option>
  <option @click="sortBy('price')">price</option>
</select>

My function:

sortBy(sortKey) {
    this.items.sort((a, b) =>
    (typeof a[sortKey] === 'string' || typeof b[sortKey] === 'string') ? 
    a[sortKey].localeCompare(b[sortKey]) : a[sortKey] - b[sortKey]);
}
1 Answers
Related