标签:rap scroll 路由 hub ack 详情 style install 项目
了解详情 https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/events.html#pullingup
1.体验像原生:滚动非常流畅,而且没有滚动条。
2.滚动位置固定:在vue中通过路由切换页面时组件会自动滚动到顶部,需要监听滚动行为才能让滚动位置固定,better-scroll解决了这个问题。
<template>
<div>
<h3>我是 classify 组件</h3>
// 需要滑动的 区域 最外层 只能包含一个 标签,即如下, div 里 只有 一个 ul 标签
<div class="wrapper">
<ul>
<li>我是第1</li>
、、、、、
<li>我是第100</li>
</ul>
</div>
</div>
</template>
<script>
// 引入 better-scroll
import BScroll from "better-scroll";
export default {
data() {
return {
scroll: null
};
},
// 需要在 mounted 这个 生命周期中 实现
mounted() {
this.scroll = new BScroll(".wrapper", {});
}
};
</script>
<style scoped>
.wrapper {
// 滑动的 区域
height: 150px;
background: skyblue;
}
</style>
标签:rap scroll 路由 hub ack 详情 style install 项目
原文地址:https://www.cnblogs.com/downrain/p/11707694.html