vue上传svg 上传显示svg vue通过链接显示svg vue上传vue时保存为xml/html代码

Web_Lys

于 2021-02-26 16:54:24 发布

阅读量1.5k

点赞数 1

分类专栏： js Vue svg 文章标签： js svg web vue

本文链接：https://blog.csdn.net/lys20000913/article/details/114140217

版权

Vue 同时被 3 个专栏收录

47 篇文章 2 订阅

订阅专栏

37 篇文章 0 订阅

订阅专栏

svg

1 篇文章 0 订阅

订阅专栏

上传限制仅svg

	//二者均可
	accept="image/svg+xml"
	accept=".svg"

显示SVG

//svg是链接的展示方式
<embed 
	v-if="editData.obj.svgUrl"   
	:src="editData.obj.svgUrl" 
	width="72" 
	height="72" 
	type="image/svg+xml"  
/>
//svg是代码的展示方式（直接使用v-html即可）
 <div v-html="editData.obj.svgUrl"></div>

上传时保存为XML/HTML

			//file ： file文件
            var formData = new Blob([file],{type:"text/plain;charset=utf-8"}); 
            var reader = new FileReader();
            reader.onload = function(e) { console.log('返回值。svg代码',e.target.result ) }
            reader.readAsText(formData);