nuxt-link作为图像
nuxt-link作为图像
提问于 2019-03-26 23:23:45
要将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>回答 3
Stack Overflow用户
发布于 2019-11-11 14:12:53
您可以在数据中不使用变量。
# this is working
<nuxt-link
tag="img"
:src="require('~/assets/icons/filterLinkButton.svg')"
to="/locations">
</nuxt-link>Stack Overflow用户
发布于 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
Stack Overflow用户
发布于 2019-03-27 07:02:24
好吧，根据文档，如果你正在使用webpack，你可以在你的css文件中使用这个别名(~assets)，但显然你需要在你的模板上使用~/版本，同时看看下面使用静态文件夹的方法，我认为更适合你，因为你在问题中使用的资产可以放在静态文件夹中，去掉别名
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55360746
复制相关文章
相似问题