vue-rescroll 是一款滚动状态管理指令化的插件。Is a rolling state management instruction plug-in.

How to use it

install

npm install @wefly/vue-rescroll --save

use

全局注册/Global registration (main.js)

import VueRescroll from '@wefly/vue-rescroll';
Vue.use(VueRescroll);

局部注册/Partial registration (*.vue)

import { directive } from '@wefly/vue-rescroll';
directives: {
    'rescroll': directive
}

*.vue

使用默认配置/use default config

<div v-rescroll="{name: 'A unique marker'}"></div>

参数配置/Parameter configuration

| key | require | value | type | discribe |
| :--: | :-----: | :----: | :---: | -------- |
| name | 是 | | string | 用来保存滚动状态的key值 | | type | 否 | 'default'/'window' | string | 滚动类型(局部，全局) | | storageMode | 否 | 'default'/'localstorage' | string | 滚动状态保存方式 | | domType | 否 | 'default'/'tab' | string | 是否为tab切换组件 |

<div
    v-rescroll="{
        name: `${id}-scroll`,
        type: 'window',
        storageMode: 'localstorage'
    }"
     ></div>

tips

页面不要使用keep-alive缓存，那样的话，钩子函数不会触发。 Don't use keep-alive caching for your pages. In that case, the hook function won't trigger 详细描述各种现象博客地址

example

demo

vue 2.0+

please use vue-rescroll