基于vue封装下拉刷新上拉加载组件基于vue封装下拉刷新上拉加载

基于vue和原生javascript封装的下拉刷新上拉加载组件，供大家参考，具体内容如下

upTilte插槽是下拉刷新的自定义内容放的地方
downTilte插槽是上拉加载的自定义内容放的地方
默认插槽为列表内容区域

组件代码如下

.refresh {width: 100%; height: 100vh; border: 2px solid #ccc; position: relative; overflow: hidden; overflow: auto; position: fixed; ul {zoom: 1; padding: 0 10%; }ul::after {content: ''; display: block; visibility: hidden; height: 0; clear: both; }li {list-style: none; width: 100%; height: 50px; line-height: 50px; text-align: center; }.UpRefresh {position: absolute; left: 50%; transform: translateX(-50%); z-index: -9; }.DownRefresh {position: relative; left: 50%; transform: translateX(-50%); margin-top: -10px; z-index: -9; }}