Skip to content

Commit 0ecb2c9

Browse files
committed
docs: update readme
1 parent dd5038e commit 0ecb2c9

File tree

1 file changed

+11
-25
lines changed

1 file changed

+11
-25
lines changed

packages/vue-virtual-scroller/README.md

Lines changed: 11 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,42 @@
11
# vue-virtual-scroller
22

33
[![npm](https://img.shields.io/npm/v/vue-virtual-scroller.svg) ![npm](https://img.shields.io/npm/dm/vue-virtual-scroller.svg)](https://www.npmjs.com/package/vue-virtual-scroller)
4-
[![vue2](https://img.shields.io/badge/vue-2.x-brightgreen.svg)](https://vuejs.org/)
4+
[![vue2](https://img.shields.io/badge/vue-3.x-brightgreen.svg)](https://vuejs.org/)
55

66
Blazing fast scrolling of any amount of data | [Live demo](https://akryum.github.io/vue-virtual-scroller/) | [Video demo](https://www.youtube.com/watch?v=Uzq1KQV8f4k)
77

8-
<p>
9-
<a href="https://www.patreon.com/akryum" target="_blank">
10-
<img src="https://c5.patreon.com/external/logo/become_a_patron_button.png" alt="Become a Patreon">
11-
</a>
12-
</p>
8+
[💚️ Become a Sponsor](https://github.com/sponsors/Akryum)
139

1410
## Sponsors
1511

16-
1712
[![sponsors logos](https://guillaume-chau.info/sponsors.png)](https://guillaume-chau.info/sponsors)
1813

19-
## Table of contents
20-
21-
- [Installation](#installation)
22-
- [Usage](#usage)
23-
- [RecycleScroller](#recyclescroller)
24-
- [DynamicScroller](#dynamicscroller)
25-
- [DynamicScrollerItem](#dynamicscrolleritem)
26-
- [IdState](#idstate)
27-
2814
# Installation
2915

3016
```
31-
npm install --save vue-virtual-scroller
17+
npm install --save vue-virtual-scroller@next
3218
```
3319

34-
**⚠️ `vue-virtual-scroller` now uses [vue-observe-visibility](https://github.com/Akryum/vue-observe-visibility#installation) to automatically refresh itself when shown to prevent display glitches. This means you need to include the [Intersection Observer polyfill](https://github.com/w3c/IntersectionObserver/tree/master/polyfill) needed by `vue-observe-visibility` for this to work in old browsers (like Internet Explorer).**
20+
```
21+
yarn add vue-virtual-scroller@next
22+
```
3523

3624
## Default import
3725

3826
Install all the components:
3927

4028
```javascript
41-
import Vue from 'vue'
4229
import VueVirtualScroller from 'vue-virtual-scroller'
4330

44-
Vue.use(VueVirtualScroller)
31+
app.use(VueVirtualScroller)
4532
```
4633

4734
Use specific components:
4835

4936
```javascript
50-
import Vue from 'vue'
5137
import { RecycleScroller } from 'vue-virtual-scroller'
5238

53-
Vue.component('RecycleScroller', RecycleScroller)
39+
app.component('RecycleScroller', RecycleScroller)
5440
```
5541

5642
**⚠️ The line below should be included when importing the package:**
@@ -68,16 +54,16 @@ import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
6854
<script src="vue-virtual-scroller/dist/vue-virtual-scroller.min.js"></script>
6955
```
7056

71-
If Vue is detected, the plugin will be installed automatically. If not, install the component:
57+
Install the component:
7258

7359
```javascript
74-
Vue.use(VueVirtualScroller)
60+
app.use(VueVirtualScroller)
7561
```
7662

7763
Or register it with a custom name:
7864

7965
```javascript
80-
Vue.component('RecycleScroller', VueVirtualScroller.RecycleScroller)
66+
app.component('RecycleScroller', VueVirtualScroller.RecycleScroller)
8167
```
8268

8369
# Usage

0 commit comments

Comments
 (0)