1、获取需要定位的元素的DOM，可以使用querySelectorAll（根据元素类型或者id获取）或使用ref获取元素DOM，注意：使用ref获取DOM，命名必须是唯一的，就算取相同的名字，最后也只能拿到一个DOM。
//模板内容//需要跳转的元素<span id="buttton">buntton</span><div id="ref_pdf_view" ref="ref_pdf_view">马上就轮到我展示了1</div><div id="ref_pdf_view" ref="ref_pdf_view">马上就轮到我展示了2</div><div id="ref_pdf_view" ref="ref_pdf_view">马上就轮到我展示了3</div>//TS 代码//第一种获取方法(此时获取到所有id为ref_pdf_view的DOM元素)const dom = document.querySelectorAll('#ref_pdf_view');(dom[2] as Element).scrollIntoView({behavior: 'smooth', // 平滑过渡block: 'start', // 上边框与视窗顶部平齐。默认值});//第二种获取方法（只能获取到一个DOM元素）(this.$refs.ref_pdf_view as Element).scrollIntoView({behavior: 'smooth', // 平滑过渡block: 'start', // 上边框与视窗顶部平齐。默认值});
2、注册点击事件，点击按钮1，实现内容1呈现的效果
const button = document.getElementById('#button');const dom = document.querySelectorAll('#ref_pdf_view');button.onclick = function () {(dom[2] as Element).scrollIntoView({behavior: 'smooth', // 平滑过渡block: 'start', // 上边框与视窗顶部平齐。默认值});};
如果出现如下报错：
说明没有拿到DOM元素，调用scrollIntoView 方法失败，或是拿到了DOM元素但是将DOM元素的类型判断错误。如：你以为拿到的是DOM数组，即所有类型名相同的元素，所以在定位时使用索引确定DOM，进而调用scrollIntoView();但实际上，JS拿到的只是单个DOM，所以方法调用就会失败。
另外，使用querySelector()获取DOM实现锚点定位，更适合定位元素个数不确定的情况，可以结合map方法，实现页面灵活渲染。
