图片url处理(带http和不带http)方法

后端返回的接口数据,图片路径,有的是相对路径,有的是带http的路径

得处理一下,如果是相对路径就拼上服务器的地址(xxx),如果是带http的路径就正常显示

方法:

javascript 复制代码
imageUrl(url){
  let str = RegExp('http');
  let newUrl;
  str.test(url) ? newUrl = url : newUrl = xxx + url;
  // xxx就是需要拼接的地址
  console.log(newUrl);
  return newUrl
}

测试了一下,一个是相对路径(/static/img/logo.png),一个是带http的路径

打印出来是没问题的

javascript 复制代码
var imgSrc = '/static/img/logo.png'  
// www.xxx.com/static/img/logo.png

var imgSrc = 'https://img-home.csdnimg.cn/images/20201124032511.png'
// https://img-home.csdnimg.cn/images/20201124032511.png

// 调用
this.imageUrl(imgSrc)
相关推荐
jerryinwuhan4 小时前
基于各城市站点流量的复合功能比较
开发语言·php
迈巴赫车主4 小时前
Java基础:list、set、map一遍过
java·开发语言
ZC跨境爬虫5 小时前
跟着MDN学HTML_day_48:(Node接口)
前端·javascript·ui·html·音视频
南 阳6 小时前
Python从入门到精通day66
开发语言·python
十八旬7 小时前
快速安装ClaudeCode完整指南
开发语言·windows·python·claude
前进的李工7 小时前
EXPLAIN输出格式全解析:JSON、TREE与可视化
开发语言·数据库·mysql·性能优化·explain
Byron Loong8 小时前
【c++】为什么有了dll和.h,还需要包含lib
java·开发语言·c++
kyriewen8 小时前
半夜三点线上崩了,AI替我背了锅——用AI排错,五分钟定位三年老bug
前端·javascript·ai编程
独隅8 小时前
CodeX + Visual Studio Code 联动的全面指南
开发语言·php
坚果派·白晓明8 小时前
【鸿蒙PC三方库移植适配框架解读系列】第一篇:Lycium C/C++ 三方库适配 — 概述与环境配置
c语言·开发语言·c++·harmonyos·开源鸿蒙·三方库·c/c++三方库