js跳转到指定位置

遇到了一个需求：修改密码的div用v-show隐藏起来，点击buttom显示，并且页面跳转到修改密码的div

<div class="box">
这里还有很长的内容
...
<div v-show="show_editpw">
    <input type="text">
    .......
</div>
...
</div>

<button @click="change">修改密码</button>

<script>
    methods: {
        change() {
            this.show_editpw = !this.show_editpw
        },
    }
</script>

 

先用了element.scrollIntoView()，不知道为啥无效,猜测是因为v-show,导致页面读取不到element

然后尝试使用最原始的方法:a标签+id

但是有一个问题是:项目是用vue写的单页面项目,使用a标签会使链接改变,像这样:

解决方法:不用a标签,用window.location.hash="id名",然后将原本的地址强制赋值给window.location.hash.

const url = window.location.hash
        window.location.hash = '#editpwd'
        window.location.hash = url

完美解决