Skip to content
Advertisement

Vue 3 app bug: why is this method executed before any click event occurs?

I am building a quiz app with Vue 3 and Bootstrap 4.

I have this method for checking if the clicked answer is the (same as the) correct answer:

JavaScript

It should be executed upon clicking a list item, as seen below:

JavaScript

If the clicked answer is correct, the list item should be added the classes text-white bg-success, otherwise it should be added text-white bg-danger.

JavaScript
JavaScript
JavaScript

The problem

To my surprise, the checkAnswer(answer) method is executed before (and in the absence of) any click.

Question

What am I doing wrong?

Advertisement

Answer

UPDATED

checkAnswer() is invoked immediately if used outside a handler.

maybe this will help, when checkAnswer() is called, store the selected answer selectedAnswer and check if answer is correct isCorrect, and use these 2 states to compare the looped answers.

JavaScript

https://jsfiddle.net/renzivan15/fw10q5og/12/

User contributions licensed under: CC BY-SA
2 People found this is helpful
Advertisement