vue 點擊圖片方法
一般項目中需要點擊觸發事件才進行查看大圖,elementUi組件庫中并沒有寫觸發需要執行的代碼,這里在觸發的方法中加this.$refs.preview.clickHandler()觸發查看大圖功能
<el-upload class="avatar-uploader" accept=".jpg,.jpeg,.png" name="image" :action="uploadImageUrl" :show-file-list="false" :on-change="imageUpload" :headers="headers" :before-upload="imageCheck"> <el-image v-if="form.applicationIconUrl" ref="preview" style="width: 80px; height: 80px" :src="form.applicationIconUrl" :preview-src-list="[form.applicationIconUrl]" > </el-image> <i v-else class="el-icon-plus" style="font-size: 18px; line-height: 80px"></i> <div @click.stop class="position-index" v-if="form.applicationIconUrl"> <i @click.stop.prevent="lookImg" class="icon iconfont icon-xiangxia"></i> <i @click.stop.prevent="deleteImg" class="icon iconfont icon-shanchu"></i> </div> </el-upload>
lookImg() { console.log(1) this.$refs.preview.clickHandler() }, deleteImg() { console.log(2) this.form.applicationIconUrl = '' },

浙公網安備 33010602011771號