• tulip-scroll
  • Artiely
  • #vue#javaScript
  • 2020-04-17
  • 129
  • 1 min read
  • loading...

介绍

tulip-scroll是一个用于vue项目的下拉刷新和上拉加载组件。原生滚动不依赖transform属性,复杂场景更方便。

Features

  • 下拉刷新
  • 上拉加载
  • 开箱即用
  • 原生滚动
  • 丰富的自定义场景
  • 滚动位置自动记录

预览

https://artiely.gitee.io/scroll/#/

文档

document

安装

使用 yarn 安装 tulip-scroll 主题:

yarn add tulip-scroll
复制成功
1

或者使用 npm 安装它:

npm i tulip-scroll
复制成功
1

如果你的网络环境不佳,推荐使用 cnpm

全局应用

mian.js

import TulipScroll from 'tulip-scroll'
vue.use(TulipScroll)
复制成功
1
2
<template>
  <div>
    <tulip-scroll >
    </tulip-scroll>
  </div>
</template>

<script>
export default {
}
</script>

<style lang="less" scoped>

</style>

复制成功
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

组件内使用

<template>
  <div>
    <tulip-scroll >
    </tulip-scroll>
  </div>
</template>

<script>
import TulipScroll from 'tulip-scroll'
export default {
  components:{
    TulipScroll
  }
}
</script>

<style lang="less" scoped>

</style>

复制成功
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20