vite创建的项目如何动态的获取图片_vite获取图片

作者：菜鸟追梦旅行 | 2024-02-15 19:43:53

踩

vite获取图片

在使用weabpack的项目中动态的获取图片可以采用：

但是使用vite创建的项目，require是无效的。需要通过下面的方法来动态获取图片

1、创建一个函数。函数的参数为你的图片名字

2、return一个newURL().href。传入两个参数。第一个参数是你的图片（img）的地址，第二个参数是import.meta.url,

3、将这个函数抽离为公共方法

4、就可以引入后使用了


//函数的代码
 
export const getImgUrl =(img)=>{
 
  return new URL(`../../assets/img/${img}`, import.meta.url).href
}

路径的问题：就是在函数中第一个参数写了图片的路径，所以在我们定义的数据里就要删了路径就行了。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/86404