如何在单击 vuejs 中的清除按钮时从下拉列表中重置所选值？答案

【问题标题】：How to reset selected value from the dropdown on clicking of clear button in vuejs?如何在单击 vuejs 中的清除按钮时从下拉列表中重置所选值？
【发布时间】：2021-05-10 12:17:10
【问题描述】：

value: 'Select (mm)',
list: ["1mm","2mm","3mm", "4mm", "55mm"],
visible: false,
      
     toggle() {
      this.visible = !this.visible;
    },
    select(option) {
        this.value = option;
    },

<div class="thickness-productlist">CLEAR</div> 
 
 <div class="aselect" :data-value="value" :data-list="list">
        <div class="selector" @click="toggle()">
            <div class="label">
                    <span>{{ value }}</span>
            </div>
            <div class="arrow" :class="{ expanded : visible }"></div>
            <div :class="{ hidden : !visible, visible }">
                <ul>
                    <li :class="{ current : item === value }" v-for="item in list" 
                  @click="select(item)" :key="item">{{ item }}</li>
                </ul>
            </div>
        </div>
    </div>

如何在 vuejs 中单击清除按钮时从下拉列表中重置所选值？

目前我有清除选项，如果我点击它，我想从下拉列表中选择值以清除。

【问题讨论】：

标签： javascript vue.js

【解决方案1】：

下拉选择的值绑定到 value 变量所以监听点击事件并将其改回

<div class="thickness-productlist" @click="value= 'Select (mm)'">CLEAR</div>

【讨论】：