jeecg-boot Vue2前端-Online表单-生成代码List.vue a-table里的图片和文件不显示的问题

个人项目开发的一些经验已经实践过的代码

官网提到了怎么弄,但是很多细节官网还没完善的,我个人作为开发者提供一下代码给你们参考以及使用

使用

使用代码生成器之后会的到java 后端的文件以及前端VUE文件,最新版本会出现VUE3内容
我的版本是3.4.4
Vue2
比如这是我的例子会出现
在这里插入图片描述
vue 里有
在这里插入图片描述
sql文件就过了,官方文档有说

.vue 和 modules

那么List.vue 里面有一个问题就是表格里的问题

<template slot="imgSlot" slot-scope="text,record">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
          <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
          <a-button
            v-else
            :ghost="true"
            type="primary"
            icon="download"
            size="small"
            @click="downloadFile(text)">
            下载
          </a-button>
        </template>

这里就是有个地方是坑!
表头里有columns: []
这里找到图片和文件如果你的需求有附件
添加一下代码

scopedSlots: {
    
    
  customRender: 'fileSlot'
}

才能在list 表格显示出来,不然是没有文件的或者图片显示的。

最后结果
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/we2006mo/article/details/131581655