javascript - 无法以编程方式在循环中重置 vuetify v-select

Question

我正在循环中生成 v-select，它工作正常。

我面临的唯一问题是，一旦我选择了某个值，就会发生一些操作，但之后我无法将下拉值重置为默认值或第一个值。

v-select 继续显示我选择的值并且不会被重置。我想手动重置它。

例如，如果我在下拉列表中选择“反馈”，那么在执行该功能后，它应该重置为“选择”

我的代码：

<v-select v-if="item.actualStatus == 'complete'"
:items="getItems('completeItems')"
label="Select"
outlined
dense
v-on:input="takeAction($event, item)"
></v-select>

获取项目函数：

getItems(type) {
  switch(type) {
    case 'completeItems':
      return this.completeItems
      break;
    }
},

数据函数中的 CompleteItems

completeItems: [
        {text: 'Select',value: ''},
        {text: 'Call Events',value: 'completeCallEvent'},
        {text: 'Feedback',value: 'completeFeedback'},
        {text: 'Listen Audio',value: 'completeListenAudio'},
        {text: 'View Video',value: 'completeViewVideo'}
      ]

采取行动功能：

takeAction(event,item) {
      switch(event) {
        case 'completeFeedback':
          this.dialogFeedback = true
          this.feedbackCall(item)
          break;
    }

Answer 1

这是一个非常简单的示例，如何重置选择。

new Vue({
el:'#app',
vuetify: new Vuetify(),
template: '<v-app><v-main><v-select v-model="selection" :items="completeItems" label="Select" outlined dense /><v-btn @click="selection = null">Reset</v-btn></v-main></v-app>',
data:
{
  selection: null,
  completeItems: [
        {text: 'Select',value: ''},
        {text: 'Call Events',value: 'completeCallEvent'},
        {text: 'Feedback',value: 'completeFeedback'},
        {text: 'Listen Audio',value: 'completeListenAudio'},
        {text: 'View Video',value: 'completeViewVideo'}
      ],
}
});

  <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
  <link href="https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" rel="stylesheet">
  <link href="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.js"></script>
<div id="app"></div>