vue better-scroll-滚动组件 的使用和可滚动区域的问题

一.浏览器滚动原理

​ 当页面内容的高度超过视口高度的时候，会出现纵向滚动条；当页面内容的宽度超过视口宽度的时候，会出现横向滚动条。也就是我们的视口展示不下内容的时候。会通过滚动条的方式让用户滚动屏幕看到剩余的内容。

二.安装

​ npm install better-sroll --save

三.引用

​ import BScroll from 'better-scroll'

四.使用

	let scroll = new BScroll(DOM,{})

​

​

		
    mounted(){
		// 在这个方法中操作，不能在created中操作，因为created是组件加载完成的时候执行，而这个时候template还没有加载，无法找到DOM文档
    }

	<div class="content">	//最外层必须设置一个高度，要不然不会有滑动效果，里面的元素必须只有一个ul要不然会出错
        <ul>				
            <li>...</li>
            <li>...</li>
            ...
        </ul>
    </div>
	<script>
        //默认情况下BScroll是不可以实时的监听滚动位置
        //probeType：侦测属性的意思