element表格里面放图片_elementUI 表格中预览图片

表格中有一列显示的图片，现需要点击图片，预览该图片，使用的elementui中的previewSrcList做的图片预览，

但是测试发现，无论点击表格中的那张图片，预览的大图都是从第一张图片，开始预览；

后面通过更改每张图片绑定的图片list的顺序，解决了次问题；

页面显示：

style="width: 50px; height: 50px"

:src="scope.row.path"

:preview-src-list="scope.row.list"

js:

getDrawerTableList(data) {

this.drawerTableList = data;

this.list = [];

// 表格数据 drawerTableList

//获取每张图片的地址

for(var i = 0 ; i < this.drawerTableList.length ; i ++){

this.list.push(this.drawerTableList[i].path)

}

//根据图片顺序(index)更改每张图片绑定的list的图片顺序

for(var i = 0 ; i < this.drawerTableList.length ; i ++){

// this.list.push(this.drawerTableList[i].path)

var container = this.list;

var frontArr = container.slice(0,i);

var behindArr = container.slice(i,this.drawerTableList.length);

var list = behindArr.concat(frontArr)

this.drawerTableList[i].list = list;

}

element表格里面放图片_elementUI 表格中预览图片相关推荐

uni-table单元格中预览图片：阻止冒泡
由于uni-table有行点击事件,导致我想单击单元格,查看预览图片时,先响应了行的点击事件,而无法响应图片预览: 可以借用@click.stop的事件修饰符: <uni-tr v-for=&q ...
viewer动态加载图片第一次点击预览图片失败的问题
如果您搜到这篇文章的话,那估计您遇到跟我一样的问题了. 众所周知,每一个插件都有很多坑,比如说市面上比较火爆的图片浏览插件viewer,有js版本和jqery版本的,尽管这两个版本不一样,但是大同小 ...
kitty终端ranger预览图片
之前在macOS中使用iterm2终端用ranger预览图片正常.最近切到archlinux了,使用kitty终端模拟器.也想实现ranger中预览图片. 相关阅读: <终端中的文件管理器ran ...
JS实现上传图片的三种方法并实现预览图片功能
在常见的用户注册页面,需要用户在本地选择一张图片作为头像,并同时预览. 常见的思路有两种:一是将图片上传至服务器的临时文件夹中,并返回该图片的url,然后渲染在html页面: 另一种思路是,直接在本地 ...
微信小程序wx.previewImage预览图片
小功能点击图片放大预览这个也是小程序开发中经常遇到的小功能,所以也单独拿出来做一下总结,其实就是一个小知识点. 文档链接 :https://developers.weixin.qq.com/min ...
使用微信内置浏览器预览图片
在微信H5开发中预览图片,可以使用其他的一些图片预览插件,但是这样却不能把其中的某张图片发送给好友.对于这种情况可以使用微信内置浏览器图片预览功能,就可以解决这个问题.不说废话直接看代码: 1.首先 ...
html 缩略图点击预览,[每天进步一点点~] uni-app 点击图片实现预览图片列表
点击图片,实现预览图片功能,并且可循环预览图片列表! image.png 一.多张图片预览 html代码 js代码 data(){ return { photos:[ { src: '图片路径1'}, ...
uniapp 上传图片＋预览图片 + 删除图片
图片是用的阿里巴巴矢量图. <template> // html部分<view class="goods-box"><view class=" ...
JQ input 文件上传并预览选择图片后,在页面上预览图片,页面渲染
有时候,我们更新界面信息时会遇到,选择图片后,并不能预览图片,必须提交数据库后才能在页面上显示出来,这样我们该怎样办呢? 起始jq为我们提供了两个方法change()和URL.createObject ...

element表格里面放图片_elementUI 表格中预览图片

element表格里面放图片_elementUI 表格中预览图片相关推荐

最新文章

热门文章