两种方式实现表格折叠操作按钮过多效果；总体利用插槽 `slot`+`ref`实现，但是可分两种方式实现；通过个数或`offsetWidth`和`scrollWidth`实现折叠效果

最近在做vue高仿网易云音乐的项目，在做的过程中发现音乐表格这个组件会被非常多的地方复用，而且需求比较复杂的和灵活。 hideColumns参数， 自定义需要隐藏哪些列。 highLightText，传入字符串，数据中命中的字符串高亮。 首先 看一下我们平常的table写法。 …

业务中表格需要展示的字段经常会超过10个，这样子就不得不重复写（复制）el-table-column显得非常low（累），所以在这里对Element的Table组件做二次封装，想起之前使用iview时在表头配置中支持自定义每一列的单元格中的内容，所以就按这个思路来做。 Vue提…

使用过element-ui的表格的同学应该都有这样的体会，做一个简单的表格还比较容易，但如果这个表格包含了顶部的按钮，还有分页，甚至再包含了行编辑，那开发工作量就成倍的增加，特别是在开发管理系统的时候，表格一个接一个的去开发， 即浪费时间，还对个人没有什么提升。今天小编带来了自…

利用`Vue+Element Table`二次封装出了一套表格组件 开发后台管理项目或者表格多的项目神器 3分钟就可以实现一个表格页面的骚操作，你值得拥有！！！

.... 这个 prop 用来传递一个初始值；这个子组件接下来希望将其作为一个本地的 prop 数据来使用。 在这种情况下，最好定义一个本地的 data 属性并将这个 prop 用作其初始值 这个 prop 以一种原始的值传入且需要进行转换。 在这种情况下，最好使用这个 pro…

| filters | | 数据过滤的选项，数组格式，数组中的元素需要有 text 和 value 属性。 | Array[{ text, value }] | - | - | | filtersMethod | | 数据过滤使用的方法，如果是多选的筛选项，对每一条数据会执行多…

又重复写模版了... table 作为数据展示组件，在日常开发中经常被用到，通过这篇文章，可以看到结合 vue 的 slot/component 特性，做一层封装，可以大大简化 table 的使用，大部分时候只需写一个配置属性就可以了。