React / CSS-更改背景图片的url（）在iOS中不起作用

Question

我正在React中实现一个亮/暗模式主题转换器，允许用户选择他们想要的主题。每个主题都有不同的背景图像。我这样做的方法是拥有一个--url变量，并根据所选的类为它们分配不同的URL路径。这适用于Windows和Android设备，但不适用于iOS设备（甚至不适用于iOS Chrome）。在这两个类中，还有其他用于背景色和字体颜色的变量，它们对于所有设备都适用。它只是URL无法正常工作。

我非常确定这也不是路径问题，因为如果我将图像包含在带有绝对路径的：root中，则图像显示正确。主要问题是，当我更改主题时，除--url外，所有其他变量均根据该类更新。关于如何在iOS设备上也可以使用此功能的任何建议？

.default {
    /* some other code for background and font color */
    --url: url("default background");
}
.dark {
    /* some other code for background and font color */
    --url: url("some other path");
}
#top {
  background-image: var(--url);
}