v-model双向数据绑定 绑定:value="item.v"
所以我可以通过this.village即可获取到小区的id值
label： 指的是显示的字，例如：
value: 指的是 值
获取时：
v 是键名，要和后端的字段名对应。
上传图片
<el-form :label-position="labelPosition" class="picture_form">
<el-form-item label="上传照片">
<div class="pictureList" v-for="(item, index) in pictureList" :key="index" v-show="isShow">
<img src="../../../assets/images/icon_quxiao.png" alt="" class="cancel" @click="cancel($event, index)">
<!-- <img src="../../../assets/images/" alt=""> -->
<!-- <div style="background: red; width: 60px; height: 60px;"></div> -->
<img :src="item.url" alt="" style=" margin-left: 0;" id="images">
</div>
<button class="addpicture">
<form enctype="multipart/form-data">
<input type="file" name="file" multiple="multiple" accept="image/*" @change="upload($event)" style="opacity:0;width:100%;height:100%;position:absolute;top:0;left:0">
</form>
</button>
<!-- <img src="../../../assets/images/icon_add.png" alt="" @click="choose"> -->
</el-form-item>
</el-form>data(){
return{
pictureList : [ { } ]
}
}
// 上传图片
upload(event) {
console.log('上传图片');
// console.log(event.target.files);
var formData = new FormData()
formData.append('userfile', document.querySelector('input[type=file]').files)
console.log(formData.get('userfile'));
var d = localStorage.getItem('userId')
var t = localStorage.getItem('token')
var options = { // 设置axios的参数
url: 'https://web.eylives.cn/deal/repair_wechat_upload.ashx?d='+ encodeURIComponent(d) + '&t=' + encodeURIComponent(t),
data: formData,
method: 'post',
headers: {
'Content-Type': 'multipart/form-data'
}
}
this.$http(options).then((res) => {
console.log('成功请求',res);
// this.pictureList[this.pictureList.length] = res.data
// console.log(this.pictureList);
let newPictureList = [{}]
for(let i =0; i < newPictureList.length; i++) {
newPictureList[i] = {
url: res.data
}
}
this.pictureList = newPictureList
console.log(this.pictureList);
this.isShow = true
this.$message.success('文件上传成功', { icon: 5 });
}).catch((err) => {
console.log('失败请求', err);
this.$message.error('文件上传失败', { icon: 5 });
}) // 发送请求
},encodeURIComponent():可把字符串作为URI 组件进行编码。
不畏浮云遮望眼 只缘身在此山中。
没事学会了就好了 动动脑子 小事。
加油哇