[英]Replacing files in input using Vue.js
I have Vue.js template file with data that contains documents.我有 Vue.js 模板文件,其中包含包含文档的数据。 My page has table.我的页面有表格。 Table has rows with input buttons upload file, like this表有输入按钮上传文件的行,像这样
<tr v-for="(doc, index) in documents">
<td :id="'doc-' + doc.id" v-show="doc.visible">
<div class="row">
<div class="col-md-9">
<a v-if="doc.document" :href="doc.document.file" v-text="doc.name"></a>
<div v-else v-text="doc.name"></div>
</div>
<div class="col-md-3">
<div class="row">
<div v-if="doc.document" class="col-md-8">
<label :for="'upload_doc_' + doc.id">
<span class="glyphicon glyphicon-upload text-primary" role="button"> Upload</span>
<input type="file"
:id="'upload_doc_' + doc.id"
class="hidden"
@change="replaceDoc($event, index)"
/>
</label>
</div>
</div>
</div>
</div>
</td>
So, some rows may contain some files and some not.因此,有些行可能包含一些文件,而有些则不包含。 But button should replace or add file to the row.但是按钮应该替换或添加文件到该行。 So i wrote method:所以我写了方法:
methods: {
replaceDoc (event, index) {
this.documents[index] = event.target.files[0]
},
But it seems that it does not contain any data, when I'm trying to send it to server it sends empty dictionary.但它似乎不包含任何数据,当我试图将它发送到服务器时,它会发送空字典。
Have you tried using Vue.set or this.$set
您是否尝试过使用Vue.set or this.$set
Instead of:代替:
this.documents[index] = event.target.files[0]
Try this:尝试这个:
this.$set(this.documents, index, event.target.files[0]);
OR或者
Vue.set(this.documents, index, event.target.files[0]);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.