如何在material-ui中更改IconButton的設計？

Question

Material-ui為我們提供了一個默認的圖標按鈕。 但是，我想將默認圖標按鈕的設計更改為如下所示： 需要IconButton設計

我可以知道如何更改嗎？ 謝謝。

Answer 1

根據這些文檔 （有關詳細說明，請參閱它們）， IconButton將可與此處找到的任何圖標一起使用。 您鏈接的圖像最像menu 。 用法示例：

 import React, {Component} from 'react'; import IconButton from '@material-ui/core/IconButton'; import Menu from '@material-ui/icons/Menu'; class App extends Component { render() { return ( <IconButton> <Menu/> </IconButton> ); } } export default App; 

如果您使用的是create-react-app並想使用自定義的SVG，請執行以下操作：

 import React, {Component} from 'react'; import IconButton from '@material-ui/core/IconButton'; import CustomMenu from './custom_menu.svg'; // root of src class App extends Component { render() { return ( <IconButton> <img src={CustomMenu}/> </IconButton> ); } } export default App;