ボタンにSVGアイコンを表示

Question

<button className="zapButton"> <Zap /> </button> 

私が見つけたのは、アイコンをボタンタグにラップすることだけです。唯一の問題は、四角形のボタンと四角形の内側のアイコンが得られることです。私が理解しようとしているのは、ボタンがSVGアイコンだけになるようにする方法です。

Answer 1

onClick属性をZapに追加することができます。どの要素もクリック可能で、ボタンである必要はありません。 また、現在持っているボタンからボーダーを削除することもできます。これには、長方形のボタンがないように見えるようにCSS border: noneがあります。

Answer 2

<button class="zap-button" style="height: auto; width: auto; border: none;"> 
    <svg></svg> 
</button> 

もちろん、インラインスタイルは使用しないでください。