码迷,mamicode.com
首页 > 其他好文 > 详细

avalon自定义指令 图片缓存

时间:2018-03-12 18:48:58      阅读:139      评论:0      收藏:0      [点我收藏+]

标签:自定义指令   exec   avalon   页面   开发者   ==   lis   百度   def   

 

  网上分享avalon的图片缓存的方法有很多,今天给大家分享一个比较简单的方法。简单粗暴,直接上代码:

  ? 改写avalon.js

  在avalon.js中找到bindingExecutors.attr = function (val, elem, data),添加自定义指令lazy(这个是自己命名的,它的名字关系到html中的调用指令名)

  代码:

  bindingExecutors.attr = function (val, elem, data) {

  var method = data.type,

  attrName = data.param

  if (method === "css") {

  avalon(elem).css(attrName, val)

  } else if(attrName==="lazy"){

  api.imageCache({url:val, thumbnail:false},(function(ret,err){

  this.setAttribute("src",ret.url);

  }).bind(elem));

  }else if (method === "attr") {

  ? 页面中得引用

  引入avalon.js这个大家应该都知道,不清楚的可以百度。

  绑定图片的时候代码如下:

<div class="aui-list-item-media">
                                                       <img  ms-attr-lazy="el.cover" src="../../image/default.png">

                                               </div>

  其中ms-attr-lazy="el.cover" 这个是缓冲以后的本地路径 src是图片缓存完以前显示的图片。

  温馨提醒:此方法,开发者需要了解avalon框架的基本用法。

    更多APP教程,请关注www.apicloud.com

avalon自定义指令 图片缓存

标签:自定义指令   exec   avalon   页面   开发者   ==   lis   百度   def   

原文地址:https://www.cnblogs.com/apicloud/p/8550170.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!