element ui table内容自动滚动

     1.html     <el-table

                        :data="refugeList"

                        height="240px"

                        ref="refugeListRef"

                      >

                        <el-table-column type="index" width="50" label="序号">

                        </el-table-column>

                        <el-table-column

                          prop="a"

                          label="应急避难所名称"

                          width="180"

                        >

                        </el-table-column>

                        <el-table-column

                          prop="b"

                          label="可容纳人数"

                          width="180"

                        >

                        </el-table-column>

                        <el-table-column prop="c" label="面积">

                        </el-table-column>

                      </el-table>

2.

  mounted() {

    this.refugeListRef();

  },

    refugeListRef() {

      const table = this.$refs.refugeListRef;

      // 拿到表格中承载数据的div元素

      const divData = table.bodyWrapper;

      // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)

      setInterval(() => {

        // 元素自增距离顶部1像素

        divData.scrollTop += 50;

        // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度)

        if (divData.clientHeight + divData.scrollTop == divData.scrollHeight) {

          // 重置table距离顶部距离

          divData.scrollTop = 0;

        }

      }, 1000); // 滚动速度

    },

table需要设置高度