動態更改紙張輸入錯誤的顏色

Question

我有一個紙張輸入元素，當輸入為空以標記已發生錯誤時，該元素將變為紅色，但是當用戶輸入無效字符串以使其看起來像是警告時，我希望該元素變為橙色。

我知道我可以使用預定義的屬性來更改顏色，如下所示：

paper-input {
  --paper-input-container-invalid-color: orange;
}

但是，此着色將應用於任何錯誤/無效狀態。

有沒有一種方法可以根據錯誤類型動態更改此顏色？

Answer 1

我找到了一種方法，使用Polymer的updateStyles函數：

Polymer.updateStyles({'--paper-input-container-invalid-color': 'new_color'});

Answer 2

您可以創建一個自定義CSS類，然后使用例如this.$.myInput.classList.add('error') 。

或在這種情況下（聚合物1.0）： 聚合物1.0-綁定CSS類