要将nuxt-link用作镜像,我需要做些什么?
当我在Vue中显示图像时,我通常会这样做:
<img src="~assets/icons/filterLinkButton.svg">但是,当我对nuxt-link执行相同的操作时,不会计算文件的路径。
# this is not working
<nuxt-link
tag="img"
src="~assets/icons/filterLinkButton.svg"
to="/locations">
</nuxt-link>我能做些什么来解决这个问题?
编辑:
但是,如果我这样做了,它就会起作用:
<template>
<nuxt-link
:src="image"
tag="img"
to="/locations">
</nuxt-link>
</template>
<script>
import image from '~/assets/icons/filterLinkButton.svg'
export default {
data() {
return {
image: image
}
}
}
</script>发布于 2019-11-11 14:12:53
您可以在数据中不使用变量。
# this is working
<nuxt-link
tag="img"
:src="require('~/assets/icons/filterLinkButton.svg')"
to="/locations">
</nuxt-link>发布于 2020-07-28 04:06:34
通过将图像放在nuxt-link标记中,我将该图像用作nuxt-link。a screen shot of a nuxt-link with an img The html viewed with chrome dev tools
发布于 2019-03-27 07:02:24
好吧,根据文档,如果你正在使用webpack,你可以在你的css文件中使用这个别名(~assets),但显然你需要在你的模板上使用~/版本,同时看看下面使用静态文件夹的方法,我认为更适合你,因为你在问题中使用的资产可以放在静态文件夹中,去掉别名
https://stackoverflow.com/questions/55360746
复制相似问题