我使用下面的代码来动态设置响应式背景图像，但它在我的组件中不起作用。图像没有显示，我的用户界面也受到干扰。

请为我的组件建议正确的代码来动态添加背景图像。

<代码><；Sly data-sly-set.BackgroundImage="；--BackgroundImage：URL（'${model.backgroundImg}'）；"；data-sly-set.backgroundImageSmall="；--backgroundImageSmall：URL（'${model.backgroundImgSmall}'）；"；data-sly-set.backgroundColor="；背景色：${model.backgroundColor}"；data-sly-set.BackgroundImageStyle="；${model.backgroundImg？背景图像：' '}；${model.backgroundImgSmall？BackgroundImagesmall：' '}；${properties.backgroundLayout}；${model.backgroundColor？背景颜色：' '}"；>；<；/sly>；<；DIV类="；superteaser-grid${model.gridstyle}"；style="；--BackgroundImage：${backgroundImageStyle@context=' unsafe '}；"；>；

顺晟科技：

的代码没有多大意义：

<代码><；Sly data-sly-set.BackgroundImage="；--BackgroundImage：URL（'${model.backgroundImg}'）；"；data-sly-set.backgroundImageSmall="；--backgroundImageSmall：URL（'${model.backgroundImgSmall}'）；"；data-sly-set.backgroundColor="；背景色：${model.backgroundColor}"；data-sly-set.BackgroundImageStyle="；${model.backgroundImg？背景图像：' '}；${model.backgroundImgSmall？BackgroundImagesmall：' '}；${properties.backgroundLayout}；${model.backgroundColor？背景颜色：' '}"；>；<；/sly>；<；DIV类="；superteaser-grid${model.gridstyle}"；style="；--BackgroundImage：${backgroundImageStyle@context=' unsafe '}；"；>；

因为<sly data-sly-set.backgroundImage="--backgroundImage:url('${model.backgroundImg}');" data-sly-set.backgroundImageSmall="--backgroundImageSmall:url('${model.backgroundImgSmall}');" data-sly-set.backgroundColor="background-color: ${model.backgroundColor}" data-sly-set.backgroundImageStyle="${model.backgroundImg ? backgroundImage : '' };${model.backgroundImgSmall ? backgroundImageSmall : '' };${properties.backgroundLayout};${model.backgroundColor ? backgroundColor : '' }"></sly> <div class="superteaser-grid ${model.gridStyle}" style="--backgroundImage:${backgroundImageStyle @ context='unsafe'}; "> 不是合法的CSS属性。然而，它看起来确实像一个BEM修改器，所以也许你想这样使用它：

<代码><；sly data-sly-set.BackgroundModifier="；${model.backgroundImg？'--BackgroundImage '：（model.backgroundImgSmall？'-backgroundImageSmall '：' '）}"；data-sly-set.backgroundStyle="；URL（${model.backgroundImg||model.backgroundImgSmall}）${Properties.backgroundLayout}${model.BackgroundColor？背景颜色：' '}"；>；<；DIV类="；superteaser-grid${backgroundmodifier}"；style="；背景：${backgroundStyle@context=' unsafe '}"；>；<；/DIV>；<；/sly>；

当然，您可以对此进行改进，有条件地在<sly data-sly-set.backgroundImage="--backgroundImage:url('${model.backgroundImg}');" data-sly-set.backgroundImageSmall="--backgroundImageSmall:url('${model.backgroundImgSmall}');" data-sly-set.backgroundColor="background-color: ${model.backgroundColor}" data-sly-set.backgroundImageStyle="${model.backgroundImg ? backgroundImage : '' };${model.backgroundImgSmall ? backgroundImageSmall : '' };${properties.backgroundLayout};${model.backgroundColor ? backgroundColor : '' }"></sly> <div class="superteaser-grid ${model.gridStyle}" style="--backgroundImage:${backgroundImageStyle @ context='unsafe'}; "> 中添加--backGroundImage和空格，但我希望使示例尽可能小。