CODEWITHSUNDEEP
vue.js
Mr.Json
Mr.Json

Reputation: 149

:selected condition in v-for loop

I want to have :selectedcondition for v-for loop

My code is:

<select id="lstCategories" multiple>
    <option value="" disabled>Choose from drop down</option>
    <option v-for="category in lstCategories" :value="category.id" :key="category.id">{{ category.name }}</option>
</select>

I want something like this:

<option v-for="category in lstCategories" 
        :value="category.id" :key="category.id" 
        :selected="this.myData.category_ids.includes(category.id)">
  {{ category.name }}
</option>

Upvotes: 0

Views: 477

Answers (1)

raina77ow
raina77ow

Reputation: 106463

Assuming myData is a part of component's state, you should just drop this from that expression, as all the template expressions are evaluated against data anyway:

<option v-for="category in lstCategories" 
        :value="category.id" :key="category.id" 
        :selected="myData.category_ids.includes(category.id)">
  {{ category.name }}
</option>

JSFiddle.

Upvotes: 1

Related Questions