クリック時のアニメーションに貼られた紙工

Question

クリックイベントで<paper-fab>のアイコンを交換しようとしています。しかし、あなたが見ることができるように、<paper-fab>の色は、そのアニメーションが詰まっているために変化します。私はrequestAnimationFrameで実験を始めました。

コード：

this.$.editFab.icon = "save"; 

requestAnimationFrame(() => { 
        this.$.editFab.icon = "save"; 
       }); 

Answer 1

私は解決策を見つけました！ paper-fabに焦点を当てたときのCSSルールの色の変化。 私はちょうどこの私のCSSに追加：

paper-fab:focus{ 
    background: my-color; 
} 

Answer 2

あなたはすなわち

paper-fab { 
    --paper-fab-keyboard-focus-background: { 
     color: --accent-color; 
    } 
} 

、 --paper-fab-keyboard-focus-backgroundで <paper-fab>のカスタムプロパティを使用する必要があります