突发奇想做一个基于vue的一个楼层跳跃,之前用js做过,但是想着说vue应该能做出更为便利的方法,上网查询了一下,发现了一个很方便的插件 vue-scrollto。
使用方法就不在这里多说了,链接里有进行详细的说明。
先用npm安装
npm install --save vue-scrollto
然后在main.js里引入
const VueScrollTo = require('vue-scrollto')
Vue.use(VueScrollTo)
// You can also pass in the default options
Vue.use(VueScrollTo, {
container: 'body', // 滚动元素
duration: 500, // 动画时长
easing: 'ease', // 动画曲线
offset: 0, // 滚动终点距离父元素顶部距离
force: true, // 强制立即执行,即便元素是可见的
cancelable: true,
onStart: false,
onDone: false,
onCancel: false,
x: false, // x 轴禁止滚动
y: true
})
之后便可以在后续的代码里使用了
做的很简易,就分了五个楼层然后进行跳跃。