Vuejs 2 Image Src属性

Question

Vuejs喜欢帮助！

我有这个带图像源的图像循环。这是代码。

<img :src="'../../'+ photo.path" alt="product" height="207" width="175" v-for="photo in product.photos" v-if="photo.is_primary === 1" />

我应该将此前缀替换为基本网址以便可重复使用。

../../

如何？ TY

Answer 1

执行：src =＆＃34; value＆＃34;时，它从computed / data中获取值，因此只需在计算属性中构建url

"astapp078"

应该是它。

Answer 2

您可以使用require()告诉Webpack将其作为依赖项处理：

<img :src="require('../../' + photo.path)" alt="..." />

这将使路径相对于构建文件而不是相对于组件文件。

Answer 3

如果我理解正确，您想要添加一个您在多个组件中使用的基本网址，而您又不想在每个组件中进行更改？

您可以在src文件夹或其他地方创建config.js或任何您想要命名的内容，然后添加

export const baseUrl = 'my/img/base'

然后在你要附加baseUrl的任何组件中

import { baseUrl } from '@/src/config'

data () {
  return {
    baseUrl: baseUrl 
    ...
  }
}

将路径更改为配置的位置。