我是VueJS的新手,很难解决这种情况。

display.vue

<template>
   <img :src="getLogo(logo)" />
</template>

<script>
 export default {
  methods: {
    getLogo(logo){
        return '../assets/'+logo;
    }
  }
}
</script>

我在该代码上收到404错误。

但是我试过不使用getLogo()函数,它会显示出来。
<template>
   <img src="../assets/logo.svg" />
</template>

图像结构为:
src/assets/logo1.svg

webpack.base.conf.js
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
 limit: 10000,
 name: utils.assetsPath('img/[name].[hash:7].[ext]')
}

有人可以通过getLogo函数帮助我显示图像吗?非常感谢你!

最佳答案

我估计使用v-bind:src时应如下

<img v-bind:src="'../assets/logo.svg'">
<!-- or shorthand -->
<img :src="'../assets/logo.svg'">

注意' '
使用<img src="../assets/logo.svg" />时,无需绑定(bind)字符串,因此这就是它起作用的原因。

关于vue.js - VueJS-显示图像的功能,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44668344/

10-14 10:56
查看更多