Vant-UI移动端(H5)下拉刷新、上拉加载实现简介

相信大家都看到或是做过移动端的下拉刷新、上拉加载的功能需求,之前有人问过我,现在针对vant-UI框架简单介绍下

1、安装、引用

# 通过 npm 安装    npm i vant -S 

# 通过 yarn 安装   yarn add vant

项目中的引用

import Vue from 'vue';

import Vant from 'vant';

import 'vant/lib/index.css';

Vue.use(Vant)

2、View层

  • @refresh — —下拉刷新事件
  • @load — — 上拉加载翻页事件
  • :finished — — 数据全部加载完 显示 finished-text
  • loading — —  显示加载中

    
        

3、methods(数据处理)

Vant-UI移动端(H5)下拉刷新、上拉加载实现简介_第1张图片

你可能感兴趣的:(前端UI框架,微信公众号,小程序,Vue)