pull-refresh-vue3

pull-refresh component for vue3
8,164
Install
npm install pull-refresh-vue3
Latest Version:0.3.1
Vue:3
License:MIT
Last Updated:Sep 8, 2021
Links: npm
Maintainer: liben

pull-refresh-vue3

Example

<template>
  <pull-refresh v-model="loading" @refresh="onRefresh">
    <p>刷新次数: {{ count }}</p>
  </pull-refresh>
</template>
import { ref } from 'vue'
import PullRefresh from 'pull-refresh-vue3'
export default {
  components: {
    PullRefresh
  },
  setup() {
    const count = ref(0);
    const loading = ref(false);
    const onRefresh = () => {
      console.log('refresh')
      setTimeout(() => {
        loading.value = false;
        count.value++;
      }, 1000);
    };

    return {
      count,
      loading,
      onRefresh
    };
  }
}

props

参数说明类型默认值
v-model是否处于加载中状态boolean-
pulling-text下拉过程提示文案string下拉即可刷新...
loosing-text释放过程提示文案string释放即可刷新...
loading-text加载过程提示文案string加载中...
success-text刷新成功提示文案string-
success-duration刷新成功提示展示时长(ms)number | string500
animation-duration动画时长number | string300
head-height顶部内容高度number | string50
pull-distance v3.0.8触发下拉刷新的距离number | string与 head-height 一致
disabled是否禁用下拉刷新booleanfalse

Events

事件名说明回调参数
refresh下拉刷新时触发-

Related Packages

vue-easy-pull-refresh

Lightweight Vue 3 pull-to-refresh component and composable with touch/mouse gest...

16,765 1
markdown-to-jsx

A very fast and versatile markdown toolchain. AST, React, React Native, SolidJS,...

214,042,213 2,394
@vue/component-compiler-utils

Lower level utilities for compiling Vue single file components

62,357,406 322
@storybook/vue3

Storybook Vue 3 renderer: Develop, document, and test UI components in isolation

40,026,008 91,392
@scalar/use-toasts

display toasts in Vue

24,371,992 16,329

Version History

Version Released Vue License
0.3.1 >=3.0.0 MIT
0.3.0 >=3.0.0 MIT