<el-dialog
v-model="table.dialog"
title="计划审核"
:close-on-press-escape="false"
:close-on-click-modal="false"
:destroy-on-close="true"
@closed="handleClose"
>
<el-image
v-for="item in table.code_img"
:key="item"
style="width: 70px; height: 70px; margin: 0 10px 0 0"
:src="domain + item"
:zoom-rate="1.2"
:preview-src-list="[domain + item]"
:initial-index="4"
fit="cover"
/>
</div>
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="">确定</el-button>
</span>
</template>
</el-dialog>
ダイアログでは、画像をクリックしてプレビューすると、最大範囲がダイアログの範囲になるためです。
el-image に属性を追加するだけです
<el-image
preview-teleported
v-for="item in table.thumb"
:key="item"
style="width: 70px; height: 70px; margin: 0 10px 0 0"
:src="domain + item"
:zoom-rate="1.2"
:preview-src-list="[domain + item]"
:initial-index="4"
fit="cover"
/>
プレビューテレポート