网站主色调,中山建设监理有限公司 网站,苏州网站开发,静态网站建设课程设计今天在做一个案例的时候#xff0c;图片放在assets/images文件夹下#xff0c;如下路径#xff0c;其中的图片不能正常显示。 list: [{ id: 1, name: 欧拉公式啤酒杯, price: 30.00, src: ./assets/images/Euler.png},{ id: 2, name: 高斯分布马克杯, price: 40.00, src: ./…今天在做一个案例的时候图片放在assets/images文件夹下如下路径其中的图片不能正常显示。 list: [{ id: 1, name: 欧拉公式啤酒杯, price: 30.00, src: ./assets/images/Euler.png},{ id: 2, name: 高斯分布马克杯, price: 40.00, src: ./assets/images/Gauss.png },{ id: 3, name: 泊松分布马克杯, price: 40.00, src: ./assets/images/Poisson.png },{ id: 4, name: 范德瓦尔斯方程搪瓷杯, price: 35.00, src: ./assets/images/Vander.png},]后来查了一下资料有两种解决方法。 方法一 new URL(‘路径’,import.meta.url).href
new URL(./assets/images/Euler.png, import.meta.url).hreflist: [{ id: 1, name: 欧拉公式啤酒杯, price: 30.00, src: new URL(./assets/images/Euler.png, import.meta.url).href },{ id: 2, name: 高斯分布马克杯, price: 40.00, src: new URL(./assets/images/Gauss.png, import.meta.url).href },{ id: 3, name: 泊松分布马克杯, price: 40.00, src: new URL(./assets/images/Poisson.png,import.meta.url).href },{ id: 4, name: 范德瓦尔斯方程搪瓷杯, price: 35.00, src: new URL(./assets/images/Vander.png,import.meta.url).href },],方法二 把图片放到public目录下的images文件夹中
list: [{ id: 1, name: 欧拉公式啤酒杯, price: 30.00, src: /images/Euler.png},{ id: 2, name: 高斯分布马克杯, price: 40.00, src: /images/Gauss.png },{ id: 3, name: 泊松分布马克杯, price: 40.00, src: /images/Poisson.png },{ id: 4, name: 范德瓦尔斯方程搪瓷杯, price: 35.00, src: /images/Vander.png},]
