javascript - 如何更改 material-ui 中 IconButton 的设计？

Material-ui 为我们提供了一个默认的图标按钮。但是，我想将默认图标按钮的设计更改为如下所示:IconButton design needed

我可以知道如何更改吗？
谢谢你。

最佳答案

根据 these docs(查看详细说明)，IconButton 将与任何图标 found here 一起使用。您链接的图像看起来最像 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;

关于javascript - 如何更改 material-ui 中 IconButton 的设计？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/51046768/