切换列表以基于选定的单选按钮显示

Question

我有一段代码，询问用户他们想在哪里展示广告。选项是，我把它们作为单选按钮：

• 所有州
• 选择州
• 除以下内容外的所有状态...

我希望状态列表在用户选择“选择状态”或“除以下内容之外的所有状态”时显示给用户。

这是我尝试过的但无法正常工作：

showStates: boolean = false;


.form-check
input.form-check-input(type="radio")  
label All States  

.form-check
input.form-check-input(type="radio" @click='showStates  = !showStates')   
label all states except except:  

.form-check
input.form-check-input(type="radio" @click='showStatus = !showStates')  
 label selected states:

查看页面

(div to show states)
.collapse.container(v-show='showStates')

Select states.
 .col-6(v-for='location in locationList')
.form-check
input.form-check-input(type='checkbox')
label.form-check-label {{location.name}}

如何获取此信息，以便仅在单击两个单选按钮时才显示状态div？

Answer 1

单选按钮仅发出更改事件。尝试使用@change代替@click。