-
在
<script setup>中使用import语法：
<template><img :src="logo" alt="Logo">
</template><script setup>
import logo from './assets/logo.png';
</script>-
使用Vue的
ref来动态地在<script setup>中更换图片： -
<template><img :src="imageSrc" alt="Dynamic Image"><button @click="changeImage">Change Image</button> </template><script setup> import { ref } from 'vue';const imageSrc = ref('./assets/logo.png');function changeImage() {imageSrc.value = './assets/other-image.png'; } </script> -
方法二：使用
new URL(url, import.meta.url)
<script setup>
import { ref } from "vue";
const Img = ref("");
Img.value = new URL("@/assets/xxxx.jpg",import.meta.url
).href;
</script>
