vue+better-scroll做上拉加载下拉刷新效果

一、安装

npm install better-scroll --save-dev

二、组件引入

import BScroll from 'better-scroll'

三、完整代码如下

  

      

          
          

              {
    {pulldownMsg}}
          
          
          

              

                  

                      
                      

                          
{
    {item.num}}
                          
{
    {item.name}}
                          
{
    {item.author}} {
    {item.year}}
                      
                  
                  

                      
起拍价¥{
    {item.price}}
                      
估价¥{
    {item.start}} - ¥{
    {item.end}}
                      
当前价¥{
    {item.newPrice}}
                  
              
          
          
          

              {
    {pullupMsg}}
          
      
      
      
刷新成功
  

四、效果图如下

注意：

1. 必须包含两个大的div，外层和内层div
2. 外层div设置可视的大小(宽或者高)-有限制宽或高
3. 内层div，包裹整个可以滚动的部分
4. 内层div高度一定大于外层div的宽或高，才能滚动（list的高度>content的高度)