聚合物在运行时更改自定义样式变量答案

【问题标题】：Polymer change custom-style variable at runtime聚合物在运行时更改自定义样式变量
【发布时间】：2015-06-26 15:53:20
【问题描述】：

我有一个应用程序，我想在运行时更改整个主题。我在自定义样式标签中定义原色，如下所示：

<style is="custom-style">
  /* Application theme */
  :root {
    --dark-primary-color: #3b280a;
    --default-primary-color: #FDB815;
    --light-primary-color: #fdd85f;
  }
</style>

以后是否可以为这些变量应用其他值？我尝试通过附加

添加新的自定义样式文件

<link rel="import" href="../styles/other-style.html">

到头，但它不起作用。我认为聚合物在一开始就解释了这一点，对吧？我现在正在考虑根本不使用自定义样式并将我的整个应用程序包装在一个元素中，我可以在其中设置带有变量的样式，但这似乎需要做很多工作，也许有人有更好的想法？

【问题讨论】：

标签： javascript html css polymer shadow-dom

【解决方案1】：

您可以手动执行此操作

 this.customStyle['--my-toolbar-color'] = 'blue';
    this.updateStyles();

查看文档part

【讨论】：