如何通过v-bind:style动态生成背景图？

[For-me]

在通过v-for出来子集之后，要生成当前节点的背景图，通过v-bind:style="{background:url(list.Cover)}"
无法正确便利出结果.
[Vue warn]: Error when evaluating expression "{background:url(list.Cover)}". Turn on debug mode to see stack trace.
请尤大大解答下，谢谢

[hanai]

大致这样

v-bind:style="{background: 'url(' + list.Cover + ')'}"

[For-me]

@hanai 如果我这里的背景图是类似于"http://sss.xxxx"域下的图片。直接这样绑定是不是就是失败的？
现在我已经改成你说的那个样子，但是div中根本没行内样式引入

[For-me]

@hanai 代码如下<template> <div class="card" v-bind:class="{'card-1':$index%4==1||$index%4==2,'card-top':$index == 2}" v-for="item in data" v-bind:style="{backgroundImage:item.Cover}"> </div></template>

[yyx990803]

'url(' + item.Cover + ')'... 只有 item.Cover 当然报错

[For-me]

@yyx990803 尤大大，如果要在这里面用三元表达式，应该怎么处理呢？常规方法会抛异常。

[Jiiiiiin]

code：
div class="swiper-slide" v-for="slide in fields.slides">

            <!--<img v-bind:data-src="slide.img" :alt="slide.title" class="swiper-lazy"/>-->
            <!--<img v-bind:data-src="slide.img" :alt="slide.title" class="swiper-lazy"/>-->
            <div  v-bind:style="background-image: url(slide.img);"></div>

err msg：

vue.js?bust=1480478486341:2643 [Vue warn]: failed to compile template:

<main-header></main-header>

<!-- start banner -->
<div class="swiper-container first-content" v-show="condition.slideListLoaded">
    <div class="swiper-wrapper">
        <div class="swiper-slide" v-for="slide in fields.slides">

            <!--<img v-bind:data-src="slide.img" :alt="slide.title" class="swiper-lazy"/>-->
            <!--<img v-bind:data-src="slide.img" :alt="slide.title" class="swiper-lazy"/>-->
            <div v-bind:style="background-image: url(slide.img);"></div>

[Jiiiiiin]

通过img标签直接绑定图片是可以的，但是绑定成bi就失败了。

[Jiiiiiin]

这样成功了 = =。。。。

[leafiy]

@Jiiiiiin
:style="background-image: 'url(' + slide.img + ')';"

[Lawrence51]

如果这种写法，后面再添加样式的话，会报错呢，写法：
:style="{background: 'url(' + techContain.bgSrc + ')',backgroundSize :100% }"

已解决，100%要加引号，尴尬

[chensiun]

:style="`background-image: url(${list.Cover})`"

[dingguoqing513]

绑定background:linear-gradient（xxxxx）呢

[JustDoIt521]

:style="{backgroundImage:url(${gift.reward_pic}), color: 'red'}"
如果多个属性的话 这样写