使用require将图片进入,写法如下:

data: () => ({logo: 'this.src="' + require('../assets/img.png') + '"'})

注:我是在data里就将字符串拼接好了,当然也可以在onerror方法里拼接,这里就不赘述了。

然后在img的onerror方法中调用

<img v-bind:src="userData.photo" :onerror="logo" class="img-box4">

在v-bind标签中,单引号' '引用的内容作为字符串存在;双引号" "引用的内容作为变量/表达式存在,可以进行运算。

Vue.js项目中,当图片无法显示时则显示默认图片的更多相关文章

  1. 如何Vue-cli开始使用在Vue.js项目中启动TDD(测试驱动开发)

    通常,使用测试驱动开发(TDD)最困难的部分是开始.你必须下载带有奇怪依赖项的软件包,让测试套件与你的构建系统协同工作,然后你必须弄清楚如何编写一个测试!难怪这么多的开发者在你提起它的时候就开始跑开了 ...

  2. Vue.js项目中使用iconfont冲突问题解决

    在开发前端项目中,字体图标变得越来越常用.一方面因为它比图片使用起来方便,可以像字体一样修改大小和颜色:另一方面是因为它可以减少请求数量,优化前端性能. iconfont的使用方法很简单,主要由三种引 ...

  3. 如何降低Vue.js项目中Webpack打包文件的大小?

    https://blog.csdn.net/maray/article/details/50988500?utm_source=blogxgwz0 import Blur from ‘vux/src/ ...

  4. Vue.js项目中使用 Ajax 和 FormDate 对象上传文件

    let param = new FormData(); param.append("paths", this.ruleForm.uploadPath); param.append( ...

  5. vue图片不存在时加载默认图片

    在文件中的img那里添加:οnerrοr="errorImg01",然后设置errorImg01的路径如果直接写成 errorImg01: ('../../assets/image ...

  6. visual studio 2019 中初始化 vue.js 项目

    vs项目模板,webpack模板的创建方式在vs里创建后,npm install的过程会卡很久,暂时原因不明,感觉应该是文件太多,需要写入太多零碎文件. 试了几种初始化方法,还是用最新cli创建最好, ...

  7. vue.js项目安装

    Vue.js 安装 NPM 方法安装vue.js项目 npm 版本需要大于 3.0,如果低于此版本需要升级它: # 查看版本 $ npm -v 2.3.0 #升级 npm npm install np ...

  8. 如何把vue.js项目部署到服务器上

    如何把vue.js项目部署到服务器上面,我用的是tomcat服务器 1-改一下config/index.js文件,如下图,把assetsPublicPath: './', productionSour ...

  9. 在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理

    在一些内部OA或者流转的文件,或者给一些客户的报价文件.合同,或者一些医院出示的给保险机构的病历资料等,有时候可能都希望快速的使用电子签章的处理方式来给文件盖上特定的印章,本篇随笔介绍基于Vue&am ...

随机推荐

  1. cocos2d-x 3.x 物理碰撞机制

    近期又弄了物理引擎.写一下吧,以下有在其它博客学习到的知识.加上自己的理解,总结下. cocos2d-x 3.X 中全新的封装的物理引擎给了开发人员最大的便捷,你不用再繁琐与各种物理引擎的细节,全然的 ...

  2. 京东7Fresh新零售架构设计分析

    7Fresh是京东第一个线上线下融合落地的零售创新业务模式,店内有大量设备的集成,设备供应商达50多家,针对线下业务的特点,团队独立规划和设计POS收银系统.店内生产系统.加工系统.货架陈列系统.魔镜 ...

  3. import 本质

    一. 模块:用来从逻辑上来组织python代码(变量,函数,类,逻辑,实现一个功能),本质就是,py结尾的python文件 1.1 导入方法: import module import module1 ...

  4. multiprocessing进程开发RuntimeError

    windows环境下multiprocessing报如下异常信息: RuntimeError: An attempt has been made to start a new process befo ...

  5. CUDA 版本,显卡驱动,Ubuntu版本,GCC版本之间的对应关系

  6. [USACO15DEC]最大流Max Flow(树链剖分,线段树)

    FJ给他的牛棚的N(2≤N≤50,000)个隔间之间安装了N-1根管道,隔间编号从1到N.所有隔间都被管道连通了. FJ有K(1≤K≤100,000)条运输牛奶的路线,第i条路线从隔间si运输到隔间t ...

  7. LR--用栈实现移进--归约分析(demo)

    1.考虑文法 \(E->E+E\) \(E->E*E\) \(E->id\) 2.最右推导 不难看出,这个文法是而二义的,所以有多个最右推导 3.移进归约 用一个栈存文法符号,用输入 ...

  8. php的mysqli_connect函数显示 No such file or directory错误以及localhost换成127.0.0.1执行成功

    Centos7环境-php7-MariaDB5.5.60 (新安装的php7,执行php -m 显示有mysqli模块,php.ini没有改其它) 测试代码为: <?php //~ echo d ...

  9. 15JavaScript switch语句

    1.JavaScript switch 语句 使用 switch 语句来选择要执行的多个代码块之一. 语法: switch(n) { case 1: 执行代码块 1 break; case 2: 执行 ...

  10. scala(9) Monad

    一个单子(Monad)说白了不过就是自函子范畴上的一个幺半群而已.这句话涉及到了几个概念:单子(Monad),自函子(Endo-Functor),幺半群(Monoid),范畴(category). 范 ...