VueJS v-bind:背景图像的样式:url()

新手上路,请多包涵

根据 VueJS 文档:

<div v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' }"></div>

我尝试了几种模式:

 <div v-bind:style="{ background-image: url(item.img), }"></div>

<div v-bind:style="{ 'background-image': url('item.img'), }"></div>

<div v-bind:style='{ backgroundImage: "url(item.img)", }'></div>

但结果对 HTML style 属性无效。

有任何想法吗?

原文由 Gus 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 500
1 个回答

尝试其他模式后,这是有效的模式:

<div v-bind:style='{ backgroundImage: "url(" + item.img + ")", }'></div>

结果是:

<div style='{ background-image: url("/img/path/img.jpg"), }'></div>

原文由 Gus 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题