在@apply中使用Polymer.updateStyles mixin

Question

我有一個動態的Polymer 2.0應用程序，但它似乎不適用於@apply。

我有CSS變量，混入：

<custom-style> 
    <style> 
     html { 
      --content-background-colour: #fff; 
      --content-foreground-colour: var(--paper-grey-700); 

      --content-mixin: { 
       background-color: var(--content-background-colour); 
       color: var(--content-foreground-colour); 
      } 
     } 

     .content-one { 
      background-color: var(--content-background-colour); 
      color: var(--content-foreground-colour); 
     } 

     .content-two { 
      @apply --content-mixin 
     } 
    </style> 
</custom-style> 

然後，我有主題，用戶可以選擇並應用：

const theme = { 
    "--content-background-colour": "var(--paper-grey-800)", 
    "--content-foreground-colour": "var(--paper-grey-100)" 
}; 

Polymer.updateStyles(theme); 

的問題是，只有直接變量更新，那些設定@apply別。 class="content-one"作品，class="content-two"類失敗。

我在做什麼錯，我該如何動態改變mixin的風格？

Answer 1

聚合物似乎仍然在使用1.x中的變量和混合使用相同的polyfill，這意味着動態樣式更新應該僅限於變量，不應該用於mixin。

您可以通過添加和刪除類來實現動態樣式。