如何让vue的图片v-bind:src设定成绝对路径？
vue设置了publicPath，图片的v-bind:src是来自后端的图片地址，然后在html页面里这个图片地址变成了vue服务端地址+publicPath+后端图片地址如果有什么方法能够把:src设置成绝对路径应该就能正常显示，但网上搜了一大堆没有解决方案，要么就只能图片转blob或者canvas再渲染，太蛋疼了 你的 source 是线上的地址就别绑定呗 这还用搜？ 再看了下可能误会了抱歉
意思是 <img :src="image"
image 是后端返回的线上地址吗
多放点代码出来呢？ 图片地址import进来一个变量，单独src这个变量
不过不建议这样用 凶手 发表于 2021-3-24 14:01
再看了下可能误会了抱歉
意思是
简化的代码如下，很普通的异步加载后端动态图片列表
<template>
<div v-for="item in itemList" :key="item.name">
<img :src="base + picAddr" />
</div>
</template>
<script>
import {BASEPATH} from 'xxx'
import {request} from 'yyy'
export default {
computed: {
base() {
return BASEPATH + '/'
}
}
data() {
return {
itemList: []
}
},
methods: {
getItemList() {
let config= {
url: 后端图片api地址,
method: 'get',
header: { "Content-Type": 'application/json' }
}
request(config).then(res=>{
this.itemList = res.data
})
}
},
beforeMount() {
this.getItemList()
}
}
</script> 宅男的爱 发表于 2021-3-24 15:35
图片地址import进来一个变量，单独src这个变量
不过不建议这样用
图片地址是后端传来的列表里才有，不能直接写死 处男鉴黄师 发表于 2021-3-24 16:42
简化的代码如下，很普通的异步加载后端动态图片列表
拼了base当然就是主楼里描述的情况了呀 凶手 发表于 2021-3-24 19:26
拼了base当然就是主楼里描述的情况了呀
base是后端的地址，上面代码里没有任何前端的地址，但最后渲染出来就变成了前端地址+pulic path+后端图片地址 我寻思你要么直接整一个计算属性专门返回拼接完成的地址？ 糊状物 发表于 2021-3-24 19:56
我寻思你要么直接整一个计算属性专门返回拼接完成的地址？
试过了一样。估计是因为设置了public path，最后渲染出来总会自动加上前端的地址 处男鉴黄师 发表于 2021-3-24 20:26
试过了一样。估计是因为设置了public path，最后渲染出来总会自动加上前端的地址 ...
加协议了吗 http https 凶手 发表于 2021-3-24 20:52
加协议了吗 http https
艹，果然加了协议就行了
页:
[1]