vue 实现跨页面锚点

1.先记录一下非跨页面的实现方法：
官方文档有写，这样在一个组件里改变hash，比如#anchor-1，
就能够跳到id为anchor-1的位置

  router.js中添加

          mode: 'history',
              srcollBehavior(to,from,savedPosition){
              if(to.hash){
                  return {
                  selector:to.hash
                 }
          }}

2.但是如果我们要做页面跳转时的锚点，
比如 a组件点击 pageb#anchor-1跳转到b组件，b组件需要根据hash跳转到指定位置，就不能用上面的方法了。
可以如下实现：
在b组件内添加一个方法：

goAnchor(selector) {
                let anchor = this.$el.querySelector(selector)
                document.documentElement.scrollTop = anchor.offsetTop 
            },
#这里是根据root 节点来scroll，可以自己根据需要调整scroll对象

在b组件的mounted中添加

this.$nextTick(()=>[
                    this.goAnchor(window.location.hash)
                ])

这样跳转到静态页面是没有问题了

但是如果

b组建执行锚点的地方是通过ajax获取数据，v-for渲染的，这样在goAnchor方法中是获取不到anchor节点的，需要等待渲染完成。我们可以通过watch来观察数据是否加载完毕

data() {
            return {
                        items:[]  #通过ajax获取
            }
},
watch:{
            items:function () {
                this.$nextTick(()=>[
                    this.goAnchor(window.location.hash)
                ])
            }
        },

这样就能解决跨页面的锚点问题