问题发生于一次mock数据，生成了base64格式的东西，因为编码包在一个变量中，不知道怎么直接在 :style 中引入。

解答1：格式background-image: url(此处是我们mock生成的base64) ------ 这里的url是死的，就是说是一大串的 base64的编码。

解答2：img :src="item.thumbnail_pic_s" 这才是正确答案啊！！！ vue的基础不好就是容易出小错误.

关键是还要记得设置宽高，基础！

 <img :style="{width:'100px',height:'100px',backgroundImage: 'url(data:balabal)',

}" alt="">

怎么在Vue中使用Base64格式的背景的更多相关文章

  1. vue中使用base64进行加解密

    vue进行Base64加解密 背景 项目中需要对特殊字符进行处理,避免json和数据库的特殊字符(""等)冲突,刚好学了信息安全,干脆整个加解密,wkk.. 使用步骤 打开dos, ...

  2. vue中使用Base64和md5和rsa

    https://blog.csdn.net/benben513624/article/details/88113459(copy) https://www.cnblogs.com/myfate/p/1 ...

  3. vue中使用base64和md5

    1.在项目根目录下安装 cnpm install --save js-base64 cnpm install --save js-md5 2.在项目文件中引入 import md5 from 'js- ...

  4. vue中使用动画vue-particles实现背景粒子酷炫效果

    先来看我做的效果 我这个是用的背景色加上这个粒子效果实现的demo 平时我们做项目的话会添加背景图片这些,可能更加好看 看我的实现步骤 cnpm install -g vue-cli vue init ...

  5. 在Vue中使用CodeMirror 格式显示错误 行数错乱 & 代码隐藏

    项目需要在线展示和编辑Json文件,所以需要找一个代码编辑器,因为我们的项目直接使用的 vueAdmin-template 这个模板 json编辑器也是直接从 vue-element-admin 项目 ...

  6. vue中的金额格式0.00 和 后台返回时间格式带T调整正常格式

    <template> <div class="consumption"> <p>{{payTime|Time}}</p> <p ...

  7. VUE中给template组件加背景

    <template> <div class="index_background" > </div> </template> < ...

  8. Vue中如何插入m3u8格式视频，3分钟学会！

    ​        大家都知道video只支持ogg.webm.MP4格式,但是要是m3u8格式的视频怎么办?最近遇到这个问题在网上找了好多办法都不行,最后找到video.js后才完美解决,所以决定写一 ...

  9. Atom 编辑器安装 linter-eslint 插件，并配置使其支持 vue 文件中的 js 格式校验

    安装方式有如下几种. 1.最常用的安装方式. # 进入atom插件文件夹 cd ~/.atom/packages/ # git clone 插件源文件 git clone https://github ...

随机推荐

  1. 【遍历二叉树】11把二叉树转换成前序遍历的链表【Flatten Binary Tree to Linked List】

    本质上是二叉树的root->right->left遍历. +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ...

  2. ffmpeg 纯静态编译，以及添加自定义库流程摘要

    需求:    1. 纯静态编译ffmpeg ,即ldd ./ffmpeg 的结果是:not a dynamic executable    2.  修改ffmpeg 项目,添加自定义功能库    3. ...

  3. ACM学习历程—HDU5422 Rikka with Graph(贪心)

    Problem Description As we know, Rikka is poor at math. Yuta is worrying about this situation, so he ...

  4. linux python 更新版本

    更新python: 第1步:更新gcc,因为gcc版本太老会导致新版本python包编译不成功 代码如下: #yum -y install gcc 系统会自动下载并安装或更新,等它自己结束 第2步:下 ...

  5. 超牛 猴子补丁，修改python内置的print

    猴子补丁一般是用于修改三方包或官方包,也可以用来修改自己或者他人的代码. 但也可以用来修改python 语言内置的关键字. 本篇博客修改python最常用的内置print,使你使用print时候,自动 ...

  6. C#动态给EXCEL列添加下拉选项

    Microsoft.Office.Interop.Excel.Application excel=new Microsoft.Office.Interop.Excel.Application(); M ...

  7. 问题：oracle ROW_NUMBER()over；结果： ORACLE 中的 ROW_NUMBER() OVER() 分析函数的用法

    ORACLE 中的 ROW_NUMBER() OVER() 分析函数的用法 ROW_NUMBER() OVER(partition by col1 order by col2) 表示根据col1分组, ...

  8. shell入门-sed-1

    sed这个工具比grep复杂一点,功能比grep复杂一点 功能也能指定匹配的行,不能颜色显示 sed 基础功能 [root@wangshaojun ~]# sed -n '10'p 1.txtuucp ...

  9. 代码，用c++实现线性链表

    #include <iostream> #include <stdio.h> #include <malloc.h> using namespace std; #d ...

  10. 加减 script函数初识

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...