首页 > 其他分享 >vue element 显示 base64格式图片

vue element 显示 base64格式图片

时间:2024-04-09 15:11:08浏览次数:34  
标签:编码 vue text image base64 element data 代码

 

<el-image 
     style="width: 300px; height: 150px"
     :src="url"
     :preview-src-list="srcList">
</el-image>

this.url='data:image/png;base64,' + row.PAGE_IMG

其他格式

data:, 文本数据
data:text/plain, 文本数据
data:text/html,HTML 代码
data:text/html;base64,base64 编码的 HTML 代码
data:text/css,CSS 代码
data:text/css;base64,base64 编码的 CSS 代码
data:text/javascript,Javascript 代码
data:text/javascript;base64,base64 编码的 Javascript 代码
data:image/gif;base64,base64 编码的 gif 图片数据
data:image/png;base64,base64 编码的 png 图片数据
data:image/jpeg;base64,base64 编码的 jpeg 图片数据
data:image/x-icon;base64,base64 编码的 icon 图片数据

 

标签:编码,vue,text,image,base64,element,data,代码
From: https://www.cnblogs.com/webljl/p/18124019

相关文章

  • 基于SpringBoot+Vue大学生租房平台的设计与实现
    基于SpringBoot+Vue大学生租房平台的设计与实现系统介绍基于SpringBoot+Vue大学生租房平台使用Java语言进行编码,使用Mysql创建数据表保存本系统产生的数据。系统可以提供信息显示和相应服务,其管理员管理房东和用户,对房东提交的信息审批信息进行审核,审核房东发布的房源信......
  • 基于canvas 或 svg绘制并生成base64 用于cesium billboard 渲染 替代label
    原因cesium的label样式不太好修改canvas生成functionlabelContent(showData){constmyConvas=document.createElement("canvas");constscale=1;//获取2d的上线文开始设置相关属性myConvas.width=150myConvas.height=65;letcont......
  • vue快速入门(十四)reduce求和
    注释很详细,直接上代码新增内容非嵌套情况求和嵌套情况求和源码<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><ti......
  • vue.js 3 初学经验
    Windows11x86_64node:'20.11.1'npm:'10.2.4'--cnpm@9.4.0:npm@9.9.2,node@20.11.1--vue@3.4.21vite@5.2.8--nginx-1.20.0onWindows-- 序章作者是前端开发入门选手,最近在学习Vue3,遇到了不少问题,特整理到本文。如有错漏,还请不吝指正。 教程选择官方文档......
  • vue父组件调用子组件的方法,获取同步(实时)的返回结果
    vue父组件调用子组件的方法,获取同步(实时)的返回结果//父组件<template><Childref="childRef"></template><script>importChildfrom'.Child.vue'components:{Child,}setup(props,ctx){constchildRef=ref()//调用子组件的方法constgetC......
  • 若依RuoYi-Vue代码生成,新建一个增删改查模块
    启动ruoyi-ui,登录前端后台 以cti_faq问答对表为例。首先在mysql数据库中建张cti_faq表CREATETABLE`cti_faq`(`id`int(11)NOTNULLAUTO_INCREMENTCOMMENT'编号',`question`varchar(255)DEFAULTNULLCOMMENT'问题内容',`answer`textCOMMENT'答案......
  • 基于SpringBoot+Vue+uniapp微信小程序的高校教师成果管理小程序的详细设计和实现(源码
    文章目录前言项目运行截图技术框架后端采用SpringBoot框架前端框架Vue可行性分析系统测试系统测试的目的系统功能测试数据库表设计代码参考数据库脚本为什么选择我?获取源码前言......
  • vue3 快速入门系列 —— vue3 路由
    vue3快速入门系列-vue3路由在vue3基础上加入路由。vue3需要使用vue-routerV4,相对于v3,大部分的VueRouterAPI都没有变化。Tip:不了解路由的同学可以看一下笔者之前的文章:vue2路由参考:vue2路由官网、vue3路由官网vue-routerV4在VueRouterAPI从v3(Vue2)到v4......
  • 开发Element-UI的Table 组件列显示隐藏,列表数据勾选批量导出/全量导出,显示导出进度并
    #用法<TabColDisplay:total="total"api-url="hgp/order"api-name="hgpLocalList":s-param="listQuery":select-ids="selIds"title="快速......
  • VUE - bigint解决前端精度丢失的问题
    VUE-bigint解决前端精度丢失的问题问题描述java后端long类型的范围-2^63~2^63,即:-9223372036854775808~9223372036854775807,它是19位的。这个数字可以通过方法获得:Long.MAX_VALUE、Long_MIN_VALUE。前端JS的数字类型的范围-2^53~2^53,即:-9007199254740991~900719925......