elementUI表格渲染遇到的几个问题总结出来，希望你没遇到过

elementUI的表格用起来很简单，但是，初次用的时候，还是遇到了一些问题。今天总结一下，方便有朋友也遇到相同的问题好解决。

• 问题一：

label值是变量怎样写？

在label前面加冒号“:”。比如：

<el-table-column prop="name" :label="namestr"></el-table-column>

其实，大部分的属性值如果是变量，都是在属性前面加冒号。

• 问题二：

列表项里有图片、图标或者是固定的文字怎样加？

可以用插槽的方式解决。

<el-table-column label="操作">
     <template slot-scope="scope">
         <a :href="'/detail?id='+scope.row.id">查看</a>
     </template>
</el-table-column>

• 问题三：

表头有图片或者图标怎样加？

也可以选择用插槽的方式解决。代码如下：

<el-table-column prop="name">
<template slot="header" slot-scope="scope">
        <span>名称</span>
       <el-tooltip class="item" effect="dark" content="名称字段" placement="top">
        <i class="el-icon-question"></i>
       </el-tooltip>
</template>
</el-table-column>

注意，表头插槽要设置slot="header"。

官方文档上有render-header属性，表示列标题 Label 区域渲染使用的 Function，使用方法：Function(h, { column, $index })。

这个也可以解决表头插入图片或者图标的问题。但是，我没有实际用过，下次用了再写吧。其他关于前端知识的文章，可以微信搜索公众号：“刘小妞的栖息地”或者识别下图的二维码查看，感谢大家的支持。