},mounted() {// 1. 初始化的时候,设置横向滚动规则this.setScrollRule(); },methods: {setScrollRule() {letthat =this;// 存一份this便于取用this.one=this.$refs.one.bodyWrapper;// 获取带有滚动条的dom元素,注意饿了么UI的el-table的横向滚动条是设置在类名为this.two=this.$refs.two.bodyWrappe...
在实现这一功能时,我们首先明确了任务的关键点:获取两个表格的滚动条DOM元素,通过`Element.scrollLeft`属性来设置滚动距离。这一操作确保了即使数据在表格中滚动,统计数据也能始终与相应的数据对应。查阅官方文档后,我们了解到滚动容器的DOM可以通过元素审查来获取。这一步骤对于定位滚动条DOM元素至关重要...
自己演示的话,直接复制粘贴即可,代码中包含注释 <template> <div class="kkk"> <div class="myWrap"> <el-table ref="one" :data="tableBody" border :header-cell-style="{ background: '#FAFAFA', color: '#333333', fontWeight: 'bold', fontSize: '14px', }" show-summary > <el-table-co...
问题描述最近产品提出一个需求,说是做表格呈现统计数据,不过数据源是来自两个地方的,所以需要做两个表格去呈现数据,同时在表格最后统计数据。效果图我们...
滚动容器(审查元素即可得知):完整代码自己演示的话,直接复制粘贴即可,代码中包含注释 <template><divclass="kkk"><divclass="myWrap"><el-tableref="one":data="tableBody"border:header-cell-style="{background:'#FAFAFA',color:'#333333',fontWeight:'bold',fontSize:'14px',}"show-...
},methods: {setScrollRule() {letthat =this;// 存一份this便于取用this.one=this.$refs.one.bodyWrapper;// 获取带有滚动条的dom元素,注意饿了么UI的el-table的横向滚动条是设置在类名为this.two=this.$refs.two.bodyWrapper;// class="el-table__body-wrapper is-scrolling-left" 这个dom上。审查元...