我正在尝试动态绑定图片src到以下形式的URL:../assets/project_screens/image_name.jpg
。
我的目录结构如下:
- src
-- assets
---- project_screens
-- profile
---- ProjectList.vue
-- store
---- profile.js
我知道需要使用webpack的require("path/to/image")
来帮助webpack构建那些图片,但路径无法解析。
// store/profile.js
projects = [
{
....
},
{
....
img_url: "../assets/project_screens/im1.jpg"
....
}
....
]
// profile/ProjectList.vue
<md-card
class="md-layout-item project-card"
v-for="(project, idx) in projects"
:key="idx"
>
<md-card-media>
<img :src="require(project.img_url)" alt="People" />
</md-card-media>
</md-card>
如果我使用URL字符串而不是动态传递URL字符串,它就能正常工作。在Stack Overflow上查找了一下,但没有其中的解决方案有帮助。难道我还缺少其他东西吗?