vue component: scroll to top smooth. (Based on MuseUI)
export default {
name: 'backtop',
data () {
return {
show: false
}
},
methods: {
handleScroll (e) {
const scrollTop = window.scrollY;
const height = window.innerHeight;
this.show = scrollTop > height;
}
},
render (h) {
return h('mu-scale-transition', [
h('mu-button', {
directives: [{
name: 'scroll',
value: {
target: this.$el,
callback: this.handleScroll
}
}, {
name: 'show',
value: this.show
}],
style: {
position: 'fixed',
right: '16px',
bottom: '16px',
'z-index': 101
},
props: {
fab: true,
color: 'blue500'
},
on: {
click: () => window.scrollTo({
'behavior': 'smooth',
'left': 0,
'top': 0
})
}
}, [
h('icon', {
props: {
name: 'angle-up'
}
})
])
]);
}
};