zoukankan      html  css  js  c++  java
  • TypeError: 无法设置未定义或 null 引用的属性“src” ——IE浏览器不兼容图片懒加载vueLazy

    异常分析:

    谷歌浏览器访问正常,IE浏览器访问部分图片无法正常展示,查看控制台,输入如下错误信息:

    经分析,只有使用过图片懒加载的地方图片展示才有问题,那么就应该是图片懒加载vue-lazyload这个组件在IE浏览器下不兼容了。

    解决方法:

    既然不兼容,暂时没有其他比较好的替代方案,那就先对IE浏览器环境做特殊处理了。

    由于我们是在标签中通过v-lazy指令调用懒加载的,那么如果是IE浏览器环境,v-lazy这个指令就无法正常工作了,那就需要我们自己添加lazy指令,把v-lazy的value赋给标签的src属性就可以了,具体代码如下:

    //图片懒加载   
    import vueLazy from "vue-lazyload";
    var userAgent = window.navigator.userAgent;
    if(userAgent.indexOf('NET') != -1) {
        //ie浏览器不兼容懒加载组件处理
        Vue.directive('lazy', function(el, binding) {
            el.src = binding.value
        })
    } else {    
        //实现图片懒加载
        Vue.use(vueLazy, {
            preLoad: 0.8,
            attempt: 3,
            loading: common.blankImg,
            listenEvents: ["scroll"],
            lazyComponent: true
        });
    }
  • 相关阅读:
    超酷图片压缩工具,就是不支持批量
    eclipse java热加载
    mysql 突然报错,连接不上
    svn问题终极解决办法
    svn经常困扰我的问题
    洛谷 P3628
    CodeForces 1091H
    委托的实际应用
    WPF 小知识点001
    C# 扩展方法一
  • 原文地址:https://www.cnblogs.com/xyyt/p/8609942.html
Copyright © 2011-2022 走看看