如果未单击任何单选按钮，则禁用按钮

Question

我在Vue中做了一个测验，它根据问题数组的索引一次显示一个问题。单个问题的示例html：

<h3>Is this a question?</h3>

<label><input type="radio" name="option" value="option">Yes</label>
<label><input type="radio" name="option" value="option">Maybe</label>
<label><input type="radio" name="option" value="option">No</label>

<button type="button" class="btn btn-default">Next question</button>

我要实现的是在用户未单击任何单选按钮（针对此特定索引问题）时禁用“下一个问题”按钮。我使用v模型使它工作，但是当我单击按钮时，它对弹出的数组中的下一个问题不起作用。有人可以帮助我吗？

Answer 1

我认为一个不错的选择是将id参数传递给按钮元素（DOM），并在数组中使用该参数将问题标记为已填充/打开，并同时显示/隐藏按钮。

Answer 2

在这里，请使用v模型。

<h3>Is this a question?</h3>

<label><input type="radio" name="option" value="option" v-model="radioValue">Yes</label>
<label><input type="radio" name="option" value="option" >Maybe</label>
<label><input type="radio" name="option" value="option" v-model="radioValue">No</label>

<button type="button" class="btn btn-default" :disabled="!radioValue">Next question</button>

希望对您有帮助。