Support page mode.

Author: tangbc

README.md

@@ -202,6 +202,7 @@ According to the demos above, here are lists of approximate statistics:
 | rtag      | String              | *        | Default value is `div`, the virtual-list root element tag name, in all cases it's style is set to `display: block;`                                                                                                                                                                       |
 | wtag      | String              | *        | Default value is `div`, the virtual-list item wrapper element tag name, in all cases it's style is set to `display: block;`                                                                                                                                                               |
 | wclass    | String              | *        | Default is no classname, the virtual-list item wrapper element class, if assign this prop, you better **not** to change it's [CSS box model](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model).                                           |
+| pagemode  | Boolean             | *        | Let virtual-list scroll with page viewport.                                                                                                                                                                                                                                               |
 | totop     | Function            | *        | Called when virtual-list is scrolled to top, no param.                                                                                                                                                                                                                                    |
 | tobottom  | Function            | *        | Called when virtual-list is scrolled to bottom, no param.                                                                                                                                                                                                                                 |
 | onscroll  | Function            | *        | Called when virtual-list is scrolling, with param: [`(event, data)`](https://github.com/tangbc/vue-virtual-scroll-list/releases/tag/v1.1.7).                                                                                                                                              |

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-virtual-scroll-list",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "description": "A vue component support big amount data list with high scroll performance.",
   "main": "src/index.js",
   "files": [

src/index.js

@@ -162,6 +162,7 @@
             if (this.pagemode) {
                 window.addEventListener('scroll', this.debounce ? _debounce(this.onScroll.bind(this), this.debounce) : this.onScroll, false)
             }
+
             if (this.start) {
                 const start = this.getZone(this.start).start
                 this.setScrollTop(this.variable ? this.getVarOffset(start) : start * this.size)
@@ -522,15 +523,21 @@
             const list = this.filter(h)
             const { paddingTop, paddingBottom } = this.delta
 
+            const renderList = h(this.wtag, {
+                'style': {
+                    'display': 'block',
+                    'padding-top': paddingTop + 'px',
+                    'padding-bottom': paddingBottom + 'px'
+                },
+                'class': this.wclass,
+                'attrs': {
+                    'role': 'group'
+                }
+            }, list)
+
+            // page mode just render list, no wraper.
             if (this.pagemode) {
-                return h(this.wtag, {
-                    'style': {
-                        'display': 'block',
-                        'padding-top': paddingTop + 'px',
-                        'padding-bottom': paddingBottom + 'px'
-                    },
-                    'class': this.wclass
-                }, list)
+                return renderList
             }
 
             return h(this.rtag, {
@@ -544,17 +551,7 @@
                     '&scroll': dbc ? _debounce(this.onScroll.bind(this), dbc) : this.onScroll
                 }
             }, [
-                h(this.wtag, {
-                    'style': {
-                        'display': 'block',
-                        'padding-top': paddingTop + 'px',
-                        'padding-bottom': paddingBottom + 'px'
-                    },
-                    'class': this.wclass,
-                    'attrs': {
-                        'role': 'group'
-                    }
-                }, list)
+                renderList
             ])
         }
     })