Element动态生成表格以及表格内容无缝滚动

Element动态生成表格以及表格内容无缝滚动

最近做了一个表格消息内容滚动的需求，闲暇之余特意封装了一个组件以供参考，该表格基于Element可以动态配置显示内容及数据，支持多级表格内容配置，支持实时推送数据更新，提供插槽自定义数据，当然你如果只想加载数据不想让列表滚动，传入isScroll='false'即可关闭内容滚动，还有不足之处还请多多指出。

效果如下所示

直接进入主题

1.页面引入组件，新建vue文件test.vue，引入表格组件，传入表格相关内容以及表格数据，内容如下

<template>
   <div style="height:100%;width:80%">
       <dt-srcoll :newData="dutyRateData"
                  :menuData="menuData"
                  :lineHeight="5"
                  :tableHeight="50">
           <template slot="footerTable">  //自定义插槽
               <el-table-column
                     label="操作">
                   <template slot-scope="row">
                      <el-button type="text" size="small">详情</el-button>
                   </template>
               </el-table-column>
           </template>
       </dt-srcoll>
   </div>
</template>

<script>
import DtSrcoll from '../components/scroll'
 export default {
   components:{
     DtSrcoll
   },
   data() {
     return {
       menuData:[ //表格内容
         {
           name:'班级',
           prop:'group'