iview+vue 表格中添加图片
开门见山,话不多说,要在表格中添加图片,可以使用td:
<table class="table-style" border="" width="100%">
<tr class="tr-style first-style-thetd" >
<td>巡查时间</td>
<td>巡查人</td>
<td>巡查地点</td>
<td>点击查看详情</td>
</tr>
<tr v-for="columns1 in data1" class="tr-style tr-style-even second-style-thetd">
<td>{{columns1.col1}}</td>
<td>{{columns1.col2}}</td>
<td>{{columns1.col4}}</td>
<td class="last-td">
<img class="img-cur" src="../../../../assets/images/mapicon.png" alt="查看" @click="menu2('/')">
</td>
</tr>
</table>
而且准确、简单。
如果想要在iview的table中添加图片,也肯定是可以的,简单的使用代码如下:
需要注意的是:
这里的图片地址用的是attrs而不是props。
iview+vue 表格中添加图片的更多相关文章
- ag-grid 表格中添加图片
ag-grid是一种非常好用的表格,网上搜索会有各种各样的基本用法,不过对于在ag-grid 表格中添加图片我没有找到方法,看了官方的文档,当然英文的自己也是靠网页翻译,最后发现有这么一个例子,我知道 ...
- Flex表格中添加图片
Flex4.5中datagrid加入图片显示image <s:DataGrid id="maingrid" x="0" y="36" ...
- 在RichTextBox控件中添加图片和文字
public void SetText(RichTextBox rtb) { rtb.Text = "在RichTextBox控件中添加图片和文字" + Environment.N ...
- 如何在VUE项目中添加ESLint
如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...
- ArcMap图层属性表中添加图片
一看标题是不是有点懵?懵就对了!刚接触到的时候我也有点懵,属性表不是都是文本啊数字啊之类的格式,怎么还可以存图片,下面就带大家来看看吧! 一.关于图层入库问题 图层进入数据库和图层以shp格式存储时, ...
- 关于在Silverlight中添加图片的问题
在Silverlight中添加图片,目前支持的Image格式有jpg和png两种,如何在目录中添加,有些什么技巧呢? <StackPanel Background="White&quo ...
- vue+element-ui中的图片获取与上传
vue+element-ui中的图片获取与上传 工作上接触了一下图片的处理,图片的格式是文件流, 记录如下. 请求图片 请求图片的时候,带上{ responseType: 'blob' }, 否则图片 ...
- ajax异步获取数据后动态向表格中添加数据(行)
因为某些原因,项目中突然需要做自己做个ajax异步获取数据后动态向表格中添加数据的页面,网上找了半天都没有 看到现成的,决定自己写个例子 1.HTML页面 <!doctype html> ...
- 如何在github的README.md中添加图片
如何在github的README.md中添加图片 总结: 链接引用: 简介: 1.在github上的仓库建立一个存放图片的文件夹,文件夹名字随意.如:img ...
随机推荐
- CSS基础--属性选择器、伪类选择器
属性选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- 《JAVA设计模式》之命令模式(Command)
在阎宏博士的<JAVA与模式>一书中开头是这样描述命令(Command)模式的: 命令模式属于对象的行为模式.命令模式又称为行动(Action)模式或交易(Transaction)模式. ...
- Java中的容器(集合)之HashMap源码解析
1.HashMap源码解析(JDK8) 基础原理: 对比上一篇<Java中的容器(集合)之ArrayList源码解析>而言,本篇只解析HashMap常用的核心方法的源码. HashMap是 ...
- yum安装时出现No more mirrors to try.
可能原因:可能是不正常删除造成的 解决方法: yum clean allyum makecacheyum -y update 然后重新安装
- SpringCloud-Eureka-Provider&Consumer
Eureka-Provider 服务的提供者 新建一个服务提供者项目 1.导入pom文件 <properties> <java.version>1.8</java.ver ...
- elasticsearch 基础 —— Mapping参数boost、coerce、copy_to、doc_values、dynamic、
boost 在查询时,各个字段可以自动提升 - 更多地依赖于相关性得分,boost参数如下: PUT my_index { "mappings": { "_doc&quo ...
- Docker Swanm集群配置
首先 可以用ContOS虚拟机 克隆 5个虚拟机,注意(克隆主机必须装了Docker,克隆后,克隆机都会有Docker) 配置 网络 克隆CentOS虚拟机 最后和到如下结果 打开2377端口 ...
- spring的@Value注解使用
https://blog.csdn.net/woheniccc/article/details/79804600 昨天看到了springMVC的controller中的属性使用了@value注解,并且 ...
- 如何为nginx配置https(免费证书)
前言: 给http协议申请ssl免费证书,还是比较主流的一种方式,但是逐渐得一些浏览器不支持自签名的证书了.毕竟这是为了使用者及平台都变得安全的方式,所以无可厚非的,而且也有很多网站即使不使用商业付费 ...
- LeetCode(力扣)——Search in Rotated Sorted Array 搜索旋转排序数组 python实现
题目描述: python实现 Search in Rotated Sorted Array 搜索旋转排序数组 中文:假设按照升序排序的数组在预先未知的某个点上进行了旋转. ( 例如,数组 [0,1 ...