Vue动态图像路径（图片未显示）

Question

我尝试动态加载不同的图片。但这还行不通。 在模板中，我有带有动态源路径的img标签：

 <template>
  <div id="test">
    <img src="require('../../assets/containermoduls/${pname}.png')" />
  </div>
</template>

这里是我的数据功能：

<script>

export default {
  data () {
    return {
    pname: '2x5'
}
}
}
</script>

这是我的文件夹结构：

-src 
--assets
---containermoduls
----2x4.png
--components
---p3component
----Page3Left.vue (where my code is from)

有人知道我在做什么错吗？我的控制台上没有任何错误消息。代替图片，我看到的东西像是图片图标。

Answer 1

您应该使用绑定:src而不是src

<img :src="require('../../assets/containermoduls/${pname}.png')" />