mounted() { let that = this; // this.dom = this.$refs.multipleTable.bodyWrapper; // this.dom.addEventListener("scroll", () => { // this.$nextTick(() => { // }); // }); document.onkeydown = function (e) { if (e.code == "Tab" && that.$refs.multipleTable) { that.scrollTabSure = true; setTimeout(() => { that.scrollTabSure = false; }, 300); } }; }, methods: { setScrollTopStart() { let topObj = {}; for (let i = 0; i < this.tableData.length; i++) { let elIdNew = document.getElementById("scoreInput" + i); if (elIdNew) { console.log(elIdNew); topObj[`scoreInput${i}`] = elIdNew.getBoundingClientRect().top; } } this.topObj = topObj; console.log(topObj); }, getNowElFn(index) { const elId = document.getElementById("scoreInput" + index); let topNum = Number(elId.getBoundingClientRect().top); let endNum = this.topObj[`scoreInput${index}`] - 826; console.log(endNum); if (!this.scrollTabSure) { return; } this.scrollTabSure = false; // const dom = this.$refs[`scoreInput${index}`].$el; // console.log(this.$refs[`scoreInput${index}`]); // console.log(dom.offsetHeight, "offsetHeight"); // console.log(dom.offsetWidth, "offsetWidth"); // console.log(dom.offsetLeft, "offsetLeft"); // console.log(dom.offsetTop, "offsetTop"); // console.log(dom.scrollTop, "scrollTop"); if (endNum > 0) { this.saveScroll(endNum); } else { this.saveScroll(0); } }, saveScroll(endNum) { this.$nextTick(() => { setTimeout(() => { var scrollTop = this.$el.querySelector(".el-table__body-wrapper"); scrollTop.scrollTop = endNum; }, 13); }); },