jsx写element-plus的upload组件时,图片预览不生效?

代码如下,el-upload的slot部分代码写法正确吗?
图片上传后,预览图可以正常显示,但hover上去时,示例中显示放大、下载、删除按钮,本地下载按钮未显示,
预览按钮点击不生效,且都不进入handlePictureCardPreview这个方法中
删除按钮点击可以生效,图片直接删掉了,但也不进入handleRemove方法
哪里有问题?

<el-upload action="#" list-type="picture-card" auto-upload={false}>
  <el-icon>
  <Plus />
  </el-icon>
<div
  v-slots={{
  file: (file) => {
    <>
        <img
            class="el-upload-list__item-thumbnail"
            src={file.url}
            alt=""
        />
        <span class="el-upload-list__item-actions">
            <span
                class="el-upload-list__item-preview"
                onClick={(file) => {
                    handlePictureCardPreview(file);
                }}
            >
                <i class="el-icon-zoom-in" onClick={test}></i>
            </span>
            <span
                class="el-upload-list__item-delete"
                onClick={(file) => {
                    handleDownload(file);
                }}
            >
                <i class="el-icon-download"></i>
            </span>
            <span
                class="el-upload-list__item-delete"
                onClick={(file) => {
                    handleRemove(file);
                }}
            >
                <i class="el-icon-delete"></i>
            </span>
        </span>
    </>;
    },
}}
></div>
</el-upload>
阅读 2.2k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题