[Vuejs]-Output user first name

0πŸ‘

βœ…

@ is shorthand for v-on:, so it’s handling a select event with a function that receives option as a parameter and assigns it to selected.

Since v-model is bound to name, you should be able to do <h1>{{name}}</h1> to have the same value show up in an H1.

The data section has the main variables for your object. name is there. There is also a computed (named filteredDataObj) that should return an array (length of zero or one) with the matching test data. If you want other fields (like id) you would need to look there. Something like

{{filteredDataObj.length ? filteredDataObj.id : ''}}

would give the id if name matched anything in the data set.

Leave a comment