I'm a beginner in vue.js and I'm attempting to change the background color by using the select option. Despite trying the cueCardsColor method, nothing seems to be happening.
<ul>
<li :class="+ cueCardColor">
<select v-model="selected">
<option v-for="option in options" v-bind:value="option.value">
{{ option.text }}
</option>
</select>
</li>
</ul>
Below are the values and the method being used:
new Vue({
el: '...',
data: {
selected: 'Select color',
options: [
{ text: 'Green', value: 'green' },
{ text: 'Red', value: 'red' },
{ text: 'Blue', value: 'blue' }
]
},
computed:{
cueCardColor() {
if(this.selected!='Select color'){
return this.selected.options
}
}
}
})