Javascript 如何重置vuetify'；sv输入文件

如何重置vuetify的v-input文件？每次上传后是否清除表单输入文件

        <v-file-input
          label="Upload"
          accept="image/*"
          @change="selectFile"
        >
        </v-file-input>

---

我认为上传后，您可以使用ref重置文件

this.$refs.fileupload.value=null

---

我认为上传后，您可以使用ref重置文件

this.$refs.fileupload.value=null

---

这很简单。首先，有一个可清除的属性，允许用户清除输入。其次，如果将数据模型设置为

null

，则输入字段也将被清除

<div id="app">
  <v-app id="inspire">
    <v-file-input
      v-model="filename"
      clearable="true" 
      label="File input"
      ></v-file-input>
    <v-row justify="center">    
     <v-btn dark
       color="secondary"
       @click="filename = null"
     >Clear</v-btn>
    </v-row>
  </v-app>       
</div>


new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data () {
    return {
      filename: null,
    }
  },
})

清楚的
新Vue({
el:“#应用程序”，
vuetify:新的vuetify（），
数据（）{
返回{
文件名：null，
}
},
})

这很简单。首先，有一个可清除的属性，允许用户清除输入。其次，如果将数据模型设置为

null

，则输入字段也将被清除

<div id="app">
  <v-app id="inspire">
    <v-file-input
      v-model="filename"
      clearable="true" 
      label="File input"
      ></v-file-input>
    <v-row justify="center">    
     <v-btn dark
       color="secondary"
       @click="filename = null"
     >Clear</v-btn>
    </v-row>
  </v-app>       
</div>


new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data () {
    return {
      filename: null,
    }
  },
})

清楚的
新Vue({
el:“#应用程序”，
vuetify:新的vuetify（），
数据（）{
返回{
文件名：null，
}
},
})

添加一个属性

：key=“componentKey”

并在代码中增加它

   <v-file-input
      label="Upload"
      accept="image/*"
      @change="selectFile"
      :key="componentKey"
    >
    </v-file-input>

---

添加一个属性

：key=“componentKey”

，并在代码中增加它

   <v-file-input
      label="Upload"
      accept="image/*"
      @change="selectFile"
      :key="componentKey"
    >
    </v-file-input>

---

我使用$refs[Vue warn]收到此警告：避免直接变异道具，因为每当父组件重新渲染时，该值将被覆盖。相反，使用基于道具值的数据或计算属性。正在变异的道具：“值”我使用$refs[Vue warn]收到此警告：避免直接变异道具，因为每当父组件重新渲染时，该值将被覆盖。相反，使用基于道具值的数据或计算属性。道具正在变异：“值”不幸验证通过：规则在清除后仍然抛出错误…不幸验证通过：规则在清除后仍然抛出错误。。。