v2-lazy-list - npm Package Compare versions

Comparing version 1.0.5 to 2.0.0

dist/index.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("beautify-scrollbar")):"function"==typeof define&&define.amd?define(["beautify-scrollbar"],e):"object"==typeof exports?exports.V2LazyList=e(require("beautify-scrollbar")):t.V2LazyList=e(t.BeautifyScrollbar)}(window,function(t){return function(t){var e={};function n(r){if(e[r])return e[r].exports;var i=e[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:r})},n.r=function(t){Object.defineProperty(t,"__esModule",{value:!0})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=2)}([function(e,n){e.exports=t},function(t,e,n){"use strict";function r(t,e){for(var n=[],r={},i=0;i<e.length;i++){var o=e[i],s=o[0],a={id:t+":"+i,css:o[1],media:o[2],sourceMap:o[3]};r[s]?r[s].parts.push(a):n.push(r[s]={id:s,parts:[a]})}return n}n.r(e),n.d(e,"default",function(){return p});var i="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!i)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var o={},s=i&&(document.head||document.getElementsByTagName("head")[0]),a=null,l=0,u=!1,c=function(){},d=null,h="data-vue-ssr-id",f="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function p(t,e,n,i){u=n,d=i||{};var s=r(t,e);return b(s),function(e){for(var n=[],i=0;i<s.length;i++){var a=s[i];(l=o[a.id]).refs--,n.push(l)}for(e?b(s=r(t,e)):s=[],i=0;i<n.length;i++){var l;if(0===(l=n[i]).refs){for(var u=0;u<l.parts.length;u++)l.parts[u]();delete o[l.id]}}}}function b(t){for(var e=0;e<t.length;e++){var n=t[e],r=o[n.id];if(r){r.refs++;for(var i=0;i<r.parts.length;i++)r.parts[i](n.parts[i]);for(;i<n.parts.length;i++)r.parts.push(g(n.parts[i]));r.parts.length>n.parts.length&&(r.parts.length=n.parts.length)}else{var s=[];for(i=0;i<n.parts.length;i++)s.push(g(n.parts[i]));o[n.id]={id:n.id,refs:1,parts:s}}}}function v(){var t=document.createElement("style");return t.type="text/css",s.appendChild(t),t}function g(t){var e,n,r=document.querySelector("style["+h+'~="'+t.id+'"]');if(r){if(u)return c;r.parentNode.removeChild(r)}if(f){var i=l++;r=a||(a=v()),e=x.bind(null,r,i,!1),n=x.bind(null,r,i,!0)}else r=v(),e=function(t,e){var n=e.css,r=e.media,i=e.sourceMap;if(r&&t.setAttribute("media",r),d.ssrId&&t.setAttribute(h,e.id),i&&(n+="\n/*# sourceURL="+i.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */"),t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}.bind(null,r),n=function(){r.parentNode.removeChild(r)};return e(t),function(r){if(r){if(r.css===t.css&&r.media===t.media&&r.sourceMap===t.sourceMap)return;e(t=r)}else n()}}var m,y=(m=[],function(t,e){return m[t]=e,m.filter(Boolean).join("\n")});function x(t,e,n,r){var i=n?"":r.css;if(t.styleSheet)t.styleSheet.cssText=y(e,i);else{var o=document.createTextNode(i),s=t.childNodes;s[e]&&t.removeChild(s[e]),s.length?t.insertBefore(o,s[e]):t.appendChild(o)}}},function(t,e,n){"use strict";n.r(e),n(5);var r=n(0),i=n.n(r),o=function(t,e,n,r,i,o,s,a){var l=typeof(t=t||{}).default;"object"!==l&&"function"!==l||(t=t.default);var u,c="function"==typeof t?t.options:t;if(e&&(c.render=e,c.staticRenderFns=[],c._compiled=!0),u)if(c.functional){c._injectStyles=u;var d=c.render;c.render=function(t,e){return u.call(e),d(t,e)}}else{var h=c.beforeCreate;c.beforeCreate=h?[].concat(h,u):[u]}return{exports:t,options:c}}({name:"v2-lazy-list",props:{data:{type:Array,default:function(){return[]},required:!0},height:{type:[Number,String],default:320},itemHeight:{type:[Number,String],default:40},threshold:{type:[Number,String],default:0}},data:function(){var t=Number.parseInt(this.height),e=Number.parseInt(this.itemHeight);return{renderList:[],scrollTop:0,viewportWith:0,viewportHeight:Number.isNaN(t)||t<320?320:t,ih:Number.isNaN(e)||e<20?20:e,contentWidth:NaN,contentHeight:NaN,contentMarginTop:0,scrollbar:null}},watch:{data:function(t){var e=this;this.initRenderList(),this.scrollbar&&this.$nextTick(function(){e.scrollbar.update({contentHeight:e.contentHeight})})},scrollTop:function(t){this.updateRenderList(),this.threshold>0&&this.contentHeight-this.viewportHeight-t<=this.threshold&&this.reachThreshold()}},provide:function(){return{list:this}},methods:{initRenderList:function(){this.contentHeight=Math.ceil(this.data.length*this.ih),this.renderList=this.getRenderList()},updateRenderList:function(){this.renderList=this.getRenderList()},getRenderList:function(){for(var t=[],e=Math.floor(this.scrollTop/this.ih),n=Math.ceil((this.scrollTop+this.viewportHeight)/this.ih),r=e;r<n;r++)void 0!==this.data[r]&&t.push(this.data[r]);return this.contentMarginTop=e*this.ih,t},updateScrollVal:function(){this.scrollTop=this.scrollbar.element.scrollTop},reachThreshold:function(){this.$emit("reach-threshold")}},mounted:function(){var t=this;this.viewportWith=this.$el.clientWidth,this.data.length&&this.initRenderList(),this.$nextTick(function(){t.scrollbar=new i.a(t.$el,{contentWidth:t.contentWidth,contentHeight:t.contentHeight}),t.$el.addEventListener("bs-update-scroll-value",t.updateScrollVal,!1)})},beforeDestroy:function(){this.scrollbar&&this.scrollbar.destroy(),this.$el.removeEventListener("bs-update-scroll-value",this.updateScrollVal,!1)}},function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{ref:"wrap",staticClass:"v2-lazy-list-wrap",style:{height:t.viewportHeight+"px"}},[n("ul",{ref:"content",staticClass:"v2-lazy-list",style:{marginTop:t.contentMarginTop+"px"}},t._l(t.renderList,function(e,r){return n("li",{key:r,staticClass:"lazy-list-item",style:{height:t.ih+"px",lineHeight:t.ih+"px"}},[t._v("\n            "+t._s(e)+"\n        ")])}))])}).exports,s={install:function(t){if(t.version<2.2)throw new Error("Only adapted to Vue 2.2.0 or higher");t.component(o.name,o)}};e.default=s,"undefined"!=typeof window&&window.Vue&&window.Vue.use(s)},function(t,e){t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var n=function(t,e){var n,r=t[1]||"",i=t[3];if(!i)return r;if(e&&"function"==typeof btoa){var o=(n=i,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(n))))+" */"),s=i.sources.map(function(t){return"/*# sourceURL="+i.sourceRoot+t+" */"});return[r].concat(s).concat([o]).join("\n")}return[r].join("\n")}(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var r={},i=0;i<this.length;i++){var o=this[i][0];"number"==typeof o&&(r[o]=!0)}for(i=0;i<t.length;i++){var s=t[i];"number"==typeof s[0]&&r[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),e.push(s))}},e}},function(t,e,n){(t.exports=n(3)(!1)).push([t.i,".v2-lazy-list-wrap {\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  width: 100%;\n  overflow: hidden;\n  border: 1px solid #d1d5da;\n}\n.v2-lazy-list {\n  position: relative;\n  list-style: none;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  border: none;\n}\n.lazy-list-item {\n  position: relative;\n  width: 100%;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  border-bottom: 1px solid #d1d5da;\n}\n.lazy-list-item:last-child {\n  border-bottom: none;\n}\n",""])},function(t,e,n){var r=n(4);"string"==typeof r&&(r=[[t.i,r,""]]),r.locals&&(t.exports=r.locals),(0,n(1).default)("6f27e697",r,!0,{})}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("beautify-scrollbar")):"function"==typeof define&&define.amd?define(["beautify-scrollbar"],e):"object"==typeof exports?exports.V2LazyList=e(require("beautify-scrollbar")):t.V2LazyList=e(t.BeautifyScrollbar)}(window,function(t){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:i})},n.r=function(t){Object.defineProperty(t,"__esModule",{value:!0})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=2)}([function(e,n){e.exports=t},function(t,e,n){"use strict";function i(t,e){for(var n=[],i={},r=0;r<e.length;r++){var o=e[r],s=o[0],a={id:t+":"+r,css:o[1],media:o[2],sourceMap:o[3]};i[s]?i[s].parts.push(a):n.push(i[s]={id:s,parts:[a]})}return n}n.r(e),n.d(e,"default",function(){return f});var r="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!r)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var o={},s=r&&(document.head||document.getElementsByTagName("head")[0]),a=null,l=0,u=!1,d=function(){},h=null,c="data-vue-ssr-id",p="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function f(t,e,n,r){u=n,h=r||{};var s=i(t,e);return g(s),function(e){for(var n=[],r=0;r<s.length;r++){var a=s[r];(l=o[a.id]).refs--,n.push(l)}for(e?g(s=i(t,e)):s=[],r=0;r<n.length;r++){var l;if(0===(l=n[r]).refs){for(var u=0;u<l.parts.length;u++)l.parts[u]();delete o[l.id]}}}}function g(t){for(var e=0;e<t.length;e++){var n=t[e],i=o[n.id];if(i){i.refs++;for(var r=0;r<i.parts.length;r++)i.parts[r](n.parts[r]);for(;r<n.parts.length;r++)i.parts.push(v(n.parts[r]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{var s=[];for(r=0;r<n.parts.length;r++)s.push(v(n.parts[r]));o[n.id]={id:n.id,refs:1,parts:s}}}}function b(){var t=document.createElement("style");return t.type="text/css",s.appendChild(t),t}function v(t){var e,n,i=document.querySelector("style["+c+'~="'+t.id+'"]');if(i){if(u)return d;i.parentNode.removeChild(i)}if(p){var r=l++;i=a||(a=b()),e=x.bind(null,i,r,!1),n=x.bind(null,i,r,!0)}else i=b(),e=function(t,e){var n=e.css,i=e.media,r=e.sourceMap;if(i&&t.setAttribute("media",i),h.ssrId&&t.setAttribute(c,e.id),r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}.bind(null,i),n=function(){i.parentNode.removeChild(i)};return e(t),function(i){if(i){if(i.css===t.css&&i.media===t.media&&i.sourceMap===t.sourceMap)return;e(t=i)}else n()}}var y,m=(y=[],function(t,e){return y[t]=e,y.filter(Boolean).join("\n")});function x(t,e,n,i){var r=n?"":i.css;if(t.styleSheet)t.styleSheet.cssText=m(e,r);else{var o=document.createTextNode(r),s=t.childNodes;s[e]&&t.removeChild(s[e]),s.length?t.insertBefore(o,s[e]):t.appendChild(o)}}},function(t,e,n){"use strict";n.r(e),n(5);var i=n(0),r=n.n(i),o={name:"v2-lazy-list",props:{data:{type:Array,default:function(){return[]},required:!0},height:{type:[Number,String],default:100},itemHeight:{type:[Number,String],default:40},tag:{type:String,default:"ul"},itemTag:{type:String,default:"li"},threshold:{type:[Number,String],default:0}},data:function(){var t=Number.parseInt(this.height),e=Number.parseInt(this.itemHeight);return{renderList:[],scrollTop:0,viewportWith:0,viewportHeight:Number.isNaN(t)||t<100?100:t,ih:Number.isNaN(e)||e<20?20:e,contentWidth:NaN,contentHeight:NaN,contentMarginTop:0,scrollbar:null}},watch:{data:function(t){var e=this;this.initRenderList(),this.scrollbar&&this.$nextTick(function(){e.scrollbar.update({contentHeight:e.contentHeight})})},scrollTop:function(t){this.updateRenderList(),this.threshold>0&&this.contentHeight-this.viewportHeight-t<=this.threshold&&this.reachThreshold()}},provide:function(){return{list:this}},render:function(t){this.$h||(this.$h=t);var e=t(this.tag,{class:{"v2-lazy-list":!0},style:{marginTop:this.contentMarginTop+"px"}},this.renderList);return t("div",{class:{"v2-lazy-list-wrap":!0},style:{height:this.viewportHeight+"px"}},[e])},methods:{renderItem:function(){},initRenderList:function(){this.contentHeight=Math.ceil(this.data.length*this.ih),this.renderList=this.getRenderList()},updateRenderList:function(){this.renderList=this.getRenderList()},getRenderList:function(){for(var t=[],e=Math.floor(this.scrollTop/this.ih),n=Math.ceil((this.scrollTop+this.viewportHeight)/this.ih),i=e;i<n;i++)void 0!==this.data[i]&&t.push(this.$h(this.itemTag,{class:{"lazy-list-item":!0},style:{height:this.ih+"px",lineHeight:this.ih+"px"}},this.$scopedSlots.default?this.$scopedSlots.default(this.data[i]):[i]));return this.contentMarginTop=e*this.ih,t},updateScrollVal:function(){this.scrollTop=this.scrollbar.element.scrollTop},reachThreshold:function(){this.$emit("reach-threshold")}},mounted:function(){var t=this;this.viewportWith=this.$el.clientWidth,this.data.length&&this.initRenderList(),this.$nextTick(function(){t.scrollbar=new r.a(t.$el,{contentWidth:t.contentWidth,contentHeight:t.contentHeight}),t.$el.addEventListener("bs-update-scroll-value",t.updateScrollVal,!1)})},beforeDestroy:function(){this.scrollbar&&this.scrollbar.destroy(),this.$el.removeEventListener("bs-update-scroll-value",this.updateScrollVal,!1)}},s={install:function(t){if(t.version<2.2)throw new Error("Only adapted to Vue 2.2.0 or higher");t.component(o.name,o)}};e.default=s,"undefined"!=typeof window&&window.Vue&&window.Vue.use(s)},function(t,e){t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var n=function(t,e){var n,i=t[1]||"",r=t[3];if(!r)return i;if(e&&"function"==typeof btoa){var o=(n=r,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(n))))+" */"),s=r.sources.map(function(t){return"/*# sourceURL="+r.sourceRoot+t+" */"});return[i].concat(s).concat([o]).join("\n")}return[i].join("\n")}(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var i={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(i[o]=!0)}for(r=0;r<t.length;r++){var s=t[r];"number"==typeof s[0]&&i[s[0]]||(n&&!s[2]?s[2]=n:n&&(s[2]="("+s[2]+") and ("+n+")"),e.push(s))}},e}},function(t,e,n){(t.exports=n(3)(!1)).push([t.i,".v2-lazy-list-wrap {\n  position: relative;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  width: 100%;\n  overflow: hidden;\n  border: 1px solid #d1d5da;\n}\n.v2-lazy-list-wrap ul,\n.v2-lazy-list-wrap ol {\n  list-style: none;\n}\n.v2-lazy-list {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  border: none;\n  display: block;\n}\n.lazy-list-item {\n  position: relative;\n  display: block;\n  width: 100%;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  border-bottom: 1px solid #d1d5da;\n}\n.lazy-list-item:last-child {\n  border-bottom: none;\n}\n",""])},function(t,e,n){var i=n(4);"string"==typeof i&&(i=[[t.i,i,""]]),i.locals&&(t.exports=i.locals),(0,n(1).default)("6f27e697",i,!0,{})}])});

package.json

 {
   "name": "v2-lazy-list",
-  "version": "1.0.5",
+  "version": "2.0.0",
   "description": "A simple lazy load list component based Vue 2.x",
@@ -42,4 +42,4 @@ "author": "dwqs",
   "peerDependencies": {
-    "vue": ">= 2.2.0",
-    "beautify-scrollbar": "^1.0.2"
+    "vue": ">= 2.5.0",
+    "beautify-scrollbar": ">=1.0.2"
   },
@@ -46,0 +46,0 @@ "devDependencies": {

README.md

@@ -1,2 +0,2 @@
-![webpack-4](https://img.shields.io/badge/webpack-4-brightgreen.svg) ![vue-version](https://img.shields.io/badge/vue-%3E%3D2.2.0-brightgreen.svg) ![license](https://img.shields.io/badge/license-MIT-brightgreen.svg) ![npm-version](https://img.shields.io/npm/v/v2-lazy-list.svg) [![build pass](https://api.travis-ci.org/dwqs/v2-lazy-list.svg?branch=master)](https://travis-ci.org/dwqs/v2-lazy-list?branch=master)
+![webpack-4](https://img.shields.io/badge/webpack-4-brightgreen.svg) ![vue-version](https://img.shields.io/badge/vue-%3E%3D2.5.0-brightgreen.svg) ![license](https://img.shields.io/badge/license-MIT-brightgreen.svg) ![npm-version](https://img.shields.io/npm/v/v2-lazy-list.svg) [![build pass](https://api.travis-ci.org/dwqs/v2-lazy-list.svg?branch=master)](https://travis-ci.org/dwqs/v2-lazy-list?branch=master)
 # v2-lazy-list
@@ -22,2 +22,3 @@ A simple lazy-load list component based Vue 2.x, which will be on-demand rendering the list based container element's viewport.
 import Vue from 'vue';
+import 'beautify-scrollbar/dist/index.css';
 import V2LazyList from 'v2-lazy-list';
@@ -39,2 +40,4 @@
 | threshold | String/Number | - | 0 | the threshold value to trigger next-fetch in infinite scrolling |
+| tag | String | HTML tag name | 'ul' | container elment tag |
+| item-tag | String | HTML tag name | 'li' | item element tag |
 
@@ -41,0 +44,0 @@ ## Events

No alert changes

Improved metrics

Number of lines in readme file

60

increased by5.26%

Worsened metrics

Total package byte prevSize

13714

decreased by-0.52%

No dependency changes