vuejs 无效道具：道具“modelValue”的类型检查失败

Question

我在 Laravel、Vue.js 和 Vuetify 应用程序中遇到 v-file-input 组件的类型不匹配错误。我正在尝试更新图像，但该组件需要一个 File 对象数组作为其 modelValue，而我提供了一个字符串。这是相关代码：

<v-file-input v-model="form.img"></v-file-input>

使用 vue-form 的数据：

form: new Form({ id: "", title: "", img: [],

// 初始化为空数组 }),

错误：'无效的道具：道具“modelValue”的类型检查失败。预期数组，得到值为“image-name.jpg”的字符串。

单击“编辑”按钮时会出现错误，该按钮会打开更新数据的模式。

我尝试将 img 初始化为空数组，但问题仍然存在。

您能否指导我如何解决此类型不匹配问题并确保 v-file-input 组件接收正确的数据类型？

v-file-input 组件应该接受空数组作为其初始模型值，不会出现错误。选择文件后， update:modelValue 事件应该触发，允许我将所选文件推送到数组中。该组件应正确渲染并允许图像更新。

Answer 1

我假设您希望使用输入组件支持多个文件，因为

form.img

是

Array

。所以您需要按照文档中的说明添加

multiple