0

我想根据所选语言更改网站的某些部分而不进行任何刷新。一切正常,但我尝试了多种方法在不刷新站点语言更改(i18n)的情况下动态绑定背景图像。但没有成功。

<div :style="{'background-image' : mainBackground}">
     test div
</div>

我创建了一个计算来返回基于语言的当前使用的链接。

mainBackground(){
    return this.isTurkishSite ? 'url(/images/home/home_bg_main_tr.jpg);' : 'url(/images/home/home_bg_main.jpg);'
}

但是在通过下拉菜单更改站点语言后,所有其他元素 src 都会更新为使用所选语言的图像文件。但只有这个后台路径没有更新。元素本身的样式属性也被删除。我不明白为什么这个解决方案不能正常工作。也渲染mainBackground计算到 div 元素中。并且返回的链接会根据语言进行更新。

我已经通过使用类绑定解决了这个问题。土耳其语 1 类,所有其他语言的主要类。并在条件类绑定中使用它们。解决方案:

:class="[isTurkishSite ? 'bg-turkish' : '']"
4

1 回答 1

1

它不起作用,因为您在 url() 指令末尾放置了分号,使用 Vue 以对象表示法设置的 css 规则不需要分号:)

于 2020-12-08T20:18:11.237 回答