vue中根据页面滑动的位置显示元素

<template>
   <div id="goto-top" :class="{show:searchBarFixed}" @click="gotop"></div>
</template>

<script>
    export default {
        data(){
            return{
             searchBarFixed:'',
            }
        },
        mounted () {
            console.log($)
            window.addEventListener('scroll',this.handleScroll)
        },
        methods:{
            handleScroll(){
                 var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
                 var offsetTop = document.querySelector('#goto-top').offsetTop
                if (scrollTop > offsetTop) {
                    this.searchBarFixed = true
                } else {
                    this.searchBarFixed = false
                }
            },
            gotop() {
            $('html, body').animate({
                'scrollTop': 0
            }, 'fast');
        }

        }
    }
</script>

这里我引入了jquery，也可以不用