切换列表以根据选定的单选按钮显示答案

【问题标题】：Toggle list to display based on selected radio button切换列表以根据选定的单选按钮显示
【发布时间】：2019-03-26 08:59:18
【问题描述】：

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

所有州
选择状态
除以下之外的所有状态...

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

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

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 只在我点击两个单选按钮时显示？

【问题讨论】：

添加你为实现它所做的一切
@varit05 我做到了.. 我创建了一个变量 boolean 将其默认设置为 false 并添加了单击按钮以切换 boolean 并使用 v-show 尝试显示 div ......就像我一样有以上但它不工作
vue devtools 中的显示状态变化？我认为你应该使用@input 或@change 而不是@click

标签： vue.js pug toggle

【解决方案1】：

单选按钮仅发出更改事件。尝试使用@change 而不是@click。

【讨论】：