better-scroll的使用案例

<template>
    <div class="wrapper">
        <div>
            <p>1</p>
            <p>1</p>
            <p>1</p>
            <p>1</p>
            <p>1</p>
            <p>1</p>
            <p>1</p>
        </div>
    </div>
</template>

//vue中的使用方式
<script>
    import betterScroll from "better-scroll";

    export default {
        name: "Category",
        mounted() {
        	//选取的这个对象中必须只能有一个子元素，子元素中包裹滚动的孙子元素，wrapper必须固定高度
        	//添加后在组件中的点击事件才能生效，button按钮可能不用设置也能生效
            new betterScroll('.wrapper', { 
                click:true 
            })
        }
    }
</script>

<style scoped>
    .wrapper{
        height: 150px;
        background-color: #999999;
        overflow: hidden;
    }
</style>