动态背景图片：后元素答案

【问题标题】：Dynamic backgroudImage :after element动态背景图片：后元素
【发布时间】：2018-08-21 06:16:57
【问题描述】：

我是新手，我一直在尝试实现我目前定义的视差效果 -

<section className="section parallax backgroundImageProp"></section>

我正在使用 css 来提供背景图片 -

.backgroundImageProp::after{
background-image: url('https://republic-prod.azureedge.net/republic-prod/stories/promolarge/xxhdpi/15207762165aa53418177b5.jpeg');
background-repeat: no-repeat;

}

目前图像是硬编码的，我希望它可以动态渲染，但多次尝试后我无法这样做，我使用下面的样式来添加 css -

var backgroundImageAfter = {
  after:{backgroundImage:'url(' + image_url + ')'},
};

<section className="section parallax" style={backgroundImageAfter}>
</section>

但这也无济于事。我在这里遗漏了一些东西。请帮忙。

【问题讨论】：

标签： reactjs mdbootstrap

【解决方案1】：

您必须在section 元素之后添加div 和style={backgroundImageAfter}，并从样式对象中删除之后。

var backgroundImageAfter = {
  backgroundImage:'url(' + image_url + '),
};

<section className="section parallax">
</section>
<div style={backgroundImageAfter}></div>

【讨论】：

尝试了同样的方法但没有帮助:(
@PraveenPandey 为什么没有帮助？这是解决问题的最简单方法。