700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 上传多张图片的html表单 element在form表单里上传多张张图片

上传多张图片的html表单 element在form表单里上传多张张图片

时间:2021-08-01 03:27:12

相关推荐

上传多张图片的html表单 element在form表单里上传多张张图片

1.template里面

title="新增"

:visible.sync="Visible"

width="30%"

>

ref="upload"

:show-file-list="true"

class="upload-demo"

action=""

:limit="6"

:before-upload="beforeupload"

:auto-upload="false"

:on-change="handleOnChange"

:data="ruleForm"

>

取 消

确 定

2.data

data() {

return {

Visible: true,

sliderImages: [],

addForm: {

sliderImage: ''

},

rules: {

image: [

{ required: true, message: '请上传图片', trigger: 'blur' }

]

}

}

},

3.methods

// 阻止upload的自己上传,进行再操作

handleOnChange(file, fileList) {

this.addForm.sliderImage = URL.createObjectURL(file.raw)

var files = this.sliderImages

files.push(this.addForm.sliderImage)

},

beforeupload(file) {

return true

},

submitForms(addForm) { // 新增表单提交

this.axios({

method: 'post',

url: 'url',

headers: { Authorization: window.sessionStorage.getItem('token') },

data: { }

})

.then(res => {

this.$refs[addForm].validate((valid) => {

if (valid) {

this.$refs.upload.submit()

// 不可缺少

} else {

console.log('error submit!!')

return false

}

})

})

.catch(function(error) {

console.log(error)

})

},

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。