先上图，做出来的效果是这样的
图片放在服务器下，mysql保存图片路径，数据类型为varchar
后台接口是用nodejs写的，查询数据库，前端调用接口，返回数据给前端
结构：
url字段存储的是图片的路径
<el-table :data="myData.list" stripe border>
<el-table-column label="宠物照" width="100px">
<template slot-scope="scope">
<img :src="scope.row.url" alt="这是图片">
</template>
</el-table-column>
<el-table-column prop="pets_id" label="宠物编号"></el-table-column>
<el-table-column prop="pet_name" label="用户名"></el-table-column>
<el-table-column prop="kind" label="品种"></el-table-column>
<el-table-column prop="species" label="类别"></el-table-column>
<el-table-column prop="color" label="毛发颜色"></el-table-column>
<el-table-column prop="pet_age" label="年龄"></el-table-column>
<el-table-column prop="pet_gender" label="性别"></el-table-column>
<el-table-column prop="health" label="健康状况"></el-table-column>
<el-table-column prop="pet_character" label="性格"></el-table-column>
<el-table-column prop="medical_history" label="有无病史">
<template slot-scope="scope">
<el-button type="text" @click="open(scope.$index,scope.row)"><u>查看</u></el-button>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button type="text" @click="edit(scope.$index,scope.row)"><u>编辑</u></el-button>
<el-button type="text" @click="deletePets(scope.row,scope.$index)"><u>删除</u></el-button>
</template>
</el-table-column>
</el-table>
渲染页面的时候，最主要的代码：
<template slot-scope="scope">
<img :src="scope.row.url" alt="这是图片">
</template>
这里的slot相当于一个小插槽，名为scope，:src绑定图片的路径，scope.row.url为获取当前所在的行的那条数据的url
比较坑的地方是一开始 这里<img :src="scope.row.url" alt="这是图片">路径容易弄错，一开始用的是v-for循环，后来想到elementUI组件自带的参数，可以直接使用scope.row，不用自己去循环遍历。
问题解决