H5W3
当前位置:H5W3 > 其他技术问题 > 正文

vue.js element-ui中table组件 中labei怎么加入一张图片

clipboard.png

这个就是需求 我怎么在label里加上这个图片 官网上说只支持string类型的 直接写上去根本就不支持, 请各位大佬帮我看看

<template>
  <div>
    <el-table
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="date"
        label="<img src='../../../assets/img/true.png'/>"
        width="180">
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
  import img from '~/assets/img/plus.png'
  export default {
    data() {
      return {
        tableData: [
          {
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄',
            tag: '家'
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄',
            tag: '公司'
          }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄',
            tag: '家'
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄',
            tag: '公司'
          }]
      }
    },
  }
</script>

回答:

若你那个符号不需要对应一列,而是独立的一个符号,用于点击时给表格增加一行,那么便可以定义一个盛装img标签的div,直接绝对定位到那个地方去,注意设置高层级的z-index,否则有可能被表格遮住无法显示或者无法点击。

本文地址:H5W3 » vue.js element-ui中table组件 中labei怎么加入一张图片

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址