首先我们需要创建一个 div 用来包裹我们的预览组件,我们来控制这个 div 的显示隐藏来实现预览组件的弹出和隐藏。 为什么这几个变量为啥要定义成全局的,如果写在指令内部 v-previewImage="" 多次 就出现多个变量,和多个组件,造成了资源浪费,然后ElImageViewer组件一个页面要写多次还会出现一个错误 我给element 提了iss...
使用el-image组件显示图片,并可点击大图预览,代码及截图如下: <!-- 病历图片展示 --> <el-image class="previewImg" :src="previewImageUrl" :zoom-rate="1.2" :preview-src-list="previewSrcList" :initial-index="1" fit="contain"> <template #error> <el-icon> <Picture /> </el-icon> </t...
首先我们需要创建一个 div 用来包裹我们的预览组件,我们来控制这个 div 的显示隐藏来实现预览组件的弹出和隐藏。 为什么这几个变量为啥要定义成全局的,如果写在指令内部 v-previewImage="" 多次 就出现多个变量,和多个组件,造成了资源浪费,然后ElImageViewer组件一个页面要写多次还会出现一个错误 我给element 提了iss...
使用el-image组件显示图片,并可点击大图预览,代码及截图如下: <!-- 病历图片展示 --> <el-image class="previewImg" :src="previewImageUrl" :zoom-rate="1.2" :preview-src-list="previewSrcList" :initial-index="1" fit="contain"> <template #error> <el-icon> <Picture /> </el-icon> </t...
vnode = h(ElImageViewer, { urlList: [binding.value],// 图片地址 hideOnClickModal:true,// 允许点击遮罩层关闭 }); }, }); } 第三步 使用 render 函数将 vnode 渲染到我们创建的div 里面,并且将我们创建的 div 插入到 body 里面 exportdefaultfunction(app){ ...
vnode = h(ElImageViewer, { urlList: [binding.value],// 图片地址 hideOnClickModal:true,// 允许点击遮罩层关闭 }); }, }); } 第三步 使用 render 函数将 vnode 渲染到我们创建的div 里面,并且将我们创建的 div 插入到 body 里面 exportdefaultfunction(app){ ...