i-rubik
Version:
A Vue.js 2.0+ UI Components Framework
1 lines • 3.02 kB
JavaScript
webpackJsonp([11,29],{239:function(i,e,t){t(319);var a=t(0)(t(266),t(344),"data-v-7df8f2d6",null);i.exports=a.exports},266:function(i,e,t){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={name:"slider",data:function(){return{imgs:["http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/1.jpg?t="+(new Date).getTime(),"http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/2.jpg?t="+(new Date).getTime(),"http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/3.jpg?t="+(new Date).getTime(),"http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/4.jpg?t="+(new Date).getTime()],images:["http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/5.jpg?t="+(new Date).getTime(),"http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/6.jpg?t="+(new Date).getTime(),"http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/7.jpg?t="+(new Date).getTime(),"http://7xiblh.com1.z0.glb.clouddn.com/rubikui/img/8.jpg?t="+(new Date).getTime()]}}}},296:function(i,e,t){e=i.exports=t(59)(),e.push([i.i,".img[data-v-7df8f2d6]{display:block;width:300px;height:300px;background-size:100%;margin:30px}","",{version:3,sources:["/./example/views/Lazy.vue"],names:[],mappings:"AACA,sBACE,cAAe,AACf,YAAa,AACb,aAAc,AACd,qBAAsB,AACtB,WAAa,CACd",file:"Lazy.vue",sourcesContent:["\n.img[data-v-7df8f2d6] {\n display: block;\n width: 300px;\n height: 300px;\n background-size: 100%;\n margin: 30px;\n}"],sourceRoot:"webpack://"}])},319:function(i,e,t){var a=t(296);"string"==typeof a&&(a=[[i.i,a,""]]),a.locals&&(i.exports=a.locals);t(226)("1a323380",a,!0)},344:function(i,e){i.exports={render:function(){var i=this,e=i.$createElement,t=i._self._c||e;return t("article",[t("h1",[i._v("图片懒加载 Lazy")]),i._v(" "),t("h2",[i._v("例子")]),i._v(" "),t("h3",[i._v("img 标签")]),i._v(" "),i._l(i.imgs,function(i){return t("img",{directives:[{name:"lazy",rawName:"v-lazy",value:i,expression:"img"}],staticClass:"img"})}),i._v(" "),t("h3",[i._v("背景图懒加载 background-image")]),i._v(" "),i._l(i.images,function(i){return t("div",{directives:[{name:"lazy",rawName:"v-lazy:background-image",value:i,expression:"img",arg:"background-image"}],staticClass:"img"})}),i._v(" "),t("h2",[i._v("API")]),i._v(" "),t("h3",[i._v("指令说明")]),i._v(" "),i._m(0),i._v(" "),t("Markup",{attrs:{lang:"html"}},[i._v('\n <img class="img" v-for="img in imgs" v-lazy="img">\n <div class="img" v-for="img in images" v-lazy:background-image="img"></div>\n ')])],2)},staticRenderFns:[function(){var i=this,e=i.$createElement,t=i._self._c||e;return t("table",{staticClass:"bordered responsive-table"},[t("thead",[t("th",[i._v("指令")]),i._v(" "),t("th",[i._v("说明")])]),i._v(" "),t("tbody",[t("tr",[t("td",[i._v('v-lazy="img"')]),i._v(" "),t("td",[i._v("此指令只能用在 img 标签,图片加载后会替换 img 标签的 src 属性")])]),i._v(" "),t("tr",[t("td",[i._v('v-lazy:background-image="img"')]),i._v(" "),t("td",[i._v("此指令可用在巨大多数标签上,图片加载后会成为该元素 CSS 的 background-image")])])])])}]}}});