<el-col :span="4" v-for="(item, index) in listData" :key="index">

        <div class="grid-content grid-icon">

          <router-link :to="item.url.replace('/', '-')">

            <!--<img src="'../../assets/img/'+item.imgUrl)" alt="">-->   //动态拼接地址，使用本地的图片不显示

            <img :src="require('../../assets/img/'+item.imgUrl)" alt=""> //换这个方法

            <span>{{item.name}}</span>

            <span>{{item.enName}}</span>

          </router-link>

        </div>

      </el-col>

vue 动态拼接地址，使用本地的图片不显示的更多相关文章

  1. vue打包后js和css、图片不显示，引用的字体找不到问题

    vue打包后js和css.图片不显示,引用的字体找不到问题:图片一般都是背景图片. 一.vue打包出现js和css不显示问题: 1.不使用mode:'history' 2.使用mode:'histor ...

  2. 解决javascript动态改变img的src属性图片不显示问题

    首先讲下这个bug的出现的情况,页面中有<a href="JavaScript:void(0)" onclick="document.getElementById( ...

  3. vue打包成app后，背景图片不显示

    问题: 在使用npm run build 打包后, 如果在页面中使用img标签引入,打包后的路径是由index.html开始访问的,真正访问的是Static/img/图片名, 是正确的, 但是写在cs ...

  4. Android 截取本地图库图片 并显示

    package com.example.image; import android.app.Activity; import android.content.Intent; import androi ...

  5. 关于electron的跨域问题，有本地的图片的地址，访问不了本地的图片

    项目中有上传图片功能,自定义input type=file 改变透明度和超出部分隐藏,把按钮和 点击的图标放在上传文件的按钮上面,然后又碰到到获取input里面的图片的本地的路径, 在electron ...

  6. Vue src动态引入图片不显示问题

    使用vue动态引入图片显示失败,查看控制台,发现图片返回类型为text/html,这里我的图片是从后台服务器上获取的,如果你没有使用Vue的devServer.proxy 进行代理,可以光速移步百度 ...

  7. vue style width a href动态拼接问题 ？

    style width 这个问题 折磨了我一个上午了  好惭愧 因为项目涉及到 进度条 所以必须用行内样式  style 用过vue的都知道 vue中style的用法 大众用法 :style=&quo ...

  8. vue获得当前页面URL动态拼接URL复制邀请链接方法

    vue获得当前页面URL动态拼接URL复制邀请链接方法 当前页面完整url可以用 location.href路由路径可以用 this.$route.path路由路径参数 this.$route.par ...

  9. Vue动态加载图片图片不显示

    图片是放在assets文件夹下的 使用require进行解决 图片不显示的原因 在webpack,将图片放在assets中,会将图片图片来当做模块来用,因为是动态加载的,所以url-loader将无法 ...

随机推荐

  1. js 操作table: insertRow()，deleteRow()，insertCell()，deleteCell()方法

    表格有几行: var trCnt = table.rows.length;  (table为Id ) 每行有几列:for (var i=0; i<trCnt; i++)              ...

  2. [模板] zkw线段树

    zkw线段树 code1简单版本 code2差分版本(暂无) code1:(有注释) //By Menteur_Hxy #include<cstdio> #include<iostr ...

  3. Django用户认证（四）自定义认证Customizing authentication

    原文:https://www.cnblogs.com/linxiyue/p/4061044.html 扩展已有的用户模型Extending the existing User model 有两种方法来 ...

  4. 加速 MySQL 导入导出的方法

    http://www.21andy.com/new/20100917/1952.html MySQL导出的SQL语句在导入时有可能会非常非常慢,在处理百万级数据的时候,可能导入要花几小时.在导出时合理 ...

  5. SQL-Oracle-创建表空间，用户，授权

    --创建表空间 create tablespace imark datafile 'E:\oracle\product\10.2.0\oradata\orcl\imark.dbf' size 500M ...

  6. [Linux]第三部分-学习Shell和Shell脚本

    vim 高级的 vii o a 进入编辑模式 esc进入一般模式:wq离开alias vi='vim' 使用vim打开viv块选择 y复制反白,d删除反白在vi中打开一个文件后,可以使用 sp fil ...

  7. 基本socket api

    socket函数,为了执行网络I/O,一个进程必须做的第一件事就是调用socket函数,并且指定通信协议类型. #include<sys/socket.h> int socket (int ...

  8. HDU 4342

    先确定M的大致范围后即可求. #include <iostream> #include <cstdio> #include <algorithm> #include ...

  9. 给 string 添加一个 GetInputStream 扩展方法

    有时候,我们须要读取一些数据,而无论这数据来源于磁盘上的数据文件,还是来源于网络上的数据.于是.就有了以下的 StringExtensions.cs: using System; using Syst ...

  10. MQ发送定时消息

    通过延时发送来发送定时消息. RocketMQ只支持固定精度时间的延时消息发送:1s 5s 10s 30s 1m 2m 3m 4m 5m 6m 7m 8m 9m 10m 20m 30m 1h 2h 若 ...