当前位置：首页 > news >正文

做的网站不能放视频软件手机优化软件下载

news 2026/4/7 3:14:03

做的网站不能放视频软件,手机优化软件下载,深圳网站建设外贸公司排名,公司网站建设重要性今天在做一个案例的时候，图片放在assets/images文件夹下，如下路径，其中的图片不能正常显示。 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).href

  list: [{ 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'},]