Добавление класса по условию. VUE
Хочу реализовать тест, чтобы при правильно выбранном ответе добавлялся класс green. У меня же классы добавляются ко всем элементам, так как идёт реактивная перерисовка страницы, а answerуже true. Подскажите, как сделать, чтобы привязка была только к элементу со статусом правильного ответа после клика но нему.Заранее спасибо.
new Vue({
el: "#app",
data: {
answer: undefined,
questions: [
{ text: "Ответ №1", status: true },
{ text: "Ответ №2", status: false },
{ text: "Ответ №3", status: true },
]
},
methods: {
check: function(status){
return this.answer = status;
}
}
})#app *{
margin: 10px;
}
.green{
background-color: green;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<h2>Вопросы:</h2>
<ol>
<li v-for="question in questions" @click="check(question.status)" :class="{green:answer}">
{{question.text}}
</li>
</ol>
</div>