Beginner here. I am attempting to create a dropdown menu for the div with an id matching my specific name.
For instance, let's say my table column names are: A, B, C.
I only want to have a dropdown menu for column A.
The template of my table looks like this:
template(v-for="field in tableFields")
th(:id="'_' + field.name")
select(v-if="field.name ==='A'" v-model="selectedScope"
option
option(v-for="scope in scopes" v-bind:value="scope" ) {{scope}}
This method works but I would like to move the logic v-if="field.name ==='A'" into a separate function.
I tried the following approach but it didn't work:
template(v-for="field in tableFields")
th(:id="'_' + field.name")
select(v-if="shouldProvideSelectOption(field)" v-model="selectedScope"
option
option(v-for="scope in scopes" v-bind:value="scope" ) {{scope}}
In the computed section, I added:
computed: {
shouldProvideSelectOption: function (field) {
return field.name === 'A'
}
},
Any ideas why it's not working?