锚点定位之-scrollIntoView

1页面代码

 <div class="tab-list">
                <div class="tab-list-div" :style="{background: clickInd === 0 ? '#5daf34' : ''}" @click="clickTab(0)">第一个</div>
                <div class="tab-list-div" :style="{background: clickInd === 1 ? '#5daf34' : ''}" @click="clickTab(1)">第两个</div>
                <div class="tab-list-div" :style="{background: clickInd === 2 ? '#5daf34' : ''}" @click="clickTab(2)">第三个</div>
                <div class="tab-list-nav">
                    <p id="nav0">111</p>
                    <p id="nav1">222</p>
                    <p id="nav2">333</p>
                    <p id="nav3">444</p>
                </div>
            </div>

2 js代码

 export default {
        data(){
            return {
                clickInd:0,
            }
       } 
......
 methods: {
   clickTab(type) {
                this.clickInd = type
                let id = '#nav' + type;
                document.querySelector(id).scrollIntoView(true);
            },
......

样式（随意写了写）：

image.png image.png