html 内联背景图片,vue内联绑定背景图片

遇到一个问题： 动态请求回来一个背景图片，然后用内联样式写上去，但是设置的背景大小的样式不生效。

---html

{{ convertGuideData.button_text }}

js

export default {

data() {

return {

copyBtn: null,

convertGuideData: {}

};

}，

created(){

this.getConverGuideDate();

},

methods:{

getConverGuideDate() { //请求接口

const parames = {

project: 'try_out'

};

apis.getConverGuide(parames).then(res => {

this.convertGuideData = res;

});

}

}

}

convertGuideData是请求接口用来存放接口数据的对象，但是像这样虽然图片渲染了，但是设置backgroundSize不生效。这是因为vue生命周期造成, created在实例创建之后同步调用。此时实例已经结束解析选项，这意味着已建立：数据绑定

所以粗暴的 直接加上一个if

image.png