how do I click on the picture to pop up the prompt box for message box?
<template>
<div class="upload">
<div id="show">
<input type="file" @change="getFile()" ref="file" id="file" multiple accept="image/jpg,image/jpeg,image/png,image/gif">
</div>
</div>
</template>
<script>
import { MessageBox } from "mint-ui"
export default {
name: "Upload",
methods: {
show() {
MessageBox({
title: "",
message: "?",
showCancelButton: true
});
},
getFile (e) {
var dataArr = []
var fd
fd = new FormData()
var iLen = e.target.files.length
for (let i = 0; i < iLen; iPP) {
var reader = new FileReader()
reader.index = i
fd.append(i, e.target.files[i])
reader.readAsDataURL(e.target.files[i])
reader.fileName = e.target.files[i].name
reader.onload = function (event) {
var imgMsg = {
name: this.fileName,
base64: this.result
}
dataArr.push(imgMsg)
var txt = event.target.result
var img = document.createElement("img")
var oDiv = document.createElement("div")
oDiv.setAttribute("class", "z_addImg")
oDiv.style.float = "left"
img.src = txt
img.onload = function () {
oDiv.appendChild(img)
document.getElementById("show").appendChild(oDiv)
var imgList = document.getElementsByClassName("z_addImg")
for (let j = 0; j < imgList.length; jPP) {
imgList[i].addEventListener("click", show)
}
}
}
}
}
}
}
</script>