图片、视频加载方式

This commit is contained in:
zhujingzhou
2025-07-20 11:36:46 +07:00
parent 2ab6513b73
commit fa06b597e5
17 changed files with 1204 additions and 375 deletions
+8 -1
View File
@@ -8,7 +8,7 @@
<template>
<div class="box">
<div v-on:paste="handlePaste" v-drag="handleDrag" >
<img v-if='imageUrl' ref="preview" :src="domain+imageUrl" alt="" style="width:300px;height:300px;">
<img v-if='newImg' ref="preview" :src="newImg" alt="" style="width:300px;height:300px;">
<div v-else style="width:300px;height:300px;border:1px solid;padding:20px;">
<div style="text-indent:2em;">将图片按<span style="color:red">cmd+C复制</span>到粘贴板<span style="color:red">cmd+V粘贴</span>至此处</div>
<div style="text-indent:2em;">或者将图片拖拽至此处</div>
@@ -18,6 +18,8 @@
</template>
<script>
import { mediaUploadImg } from '@/api/components/UploadImgPaste'
import { handleVerAutoImg } from '@/utils/index.js'
export default {
data() {
return {
@@ -34,6 +36,10 @@ export default {
watch: {
img: function(val) {
this.imageUrl = val
},
imageUrl: async function(val, oldval) {
const a = await handleVerAutoImg(this.domain + val)
this.newImg = a
}
},
mounted() {
@@ -44,6 +50,7 @@ export default {
}
},
methods: {
handleDrag(event) {
const items = Array.from(event.dataTransfer.items)
let file = null