Vue中如何使用动态绑定方式使用静态图片?
方法1(不推荐):
将图片放到public目录下,即可以正常使用。
方法2(推荐):
不妨建立common文件夹,然后建立common.js文件,写个函数,如下:
export const getAssetsImages = (name) => {
return new URL(`/src/assets/image/${name}`, import.meta.url).href;
};
图片放在src/assets/image文件夹里,在使用的地方使用:
import { getAssetsImages } from '@/common/common.js';
const imgList = reactive([
{ id: '1', url: getAssetsImages('1.png') },
{ id: '2', url: getAssetsImages('2.png') },
{ id: '3', url: getAssetsImages('3.png') }
]);
本文来自博客园,作者:RHCHIK,转载请注明原文链接:https://www.cnblogs.com/suihung/p/16768067.html