Question

因此，我正在尝试创建自定义Svgicon，但所有the source code uses the paths directly。无论如何，我可以从这样的图像中添加SVG图标吗？

import { SvgIcon } from '@material-ui/core';
import React from 'react';

const iconStyles = {
  marginRight: 24,
};

export const LawyersIcon = props => (
  <SvgIcon {...props}>
    <img src="https://pictures-for-website.nyc3.digitaloceanspaces.com/icons/team.svg" />
  </SvgIcon>
);

Answer 1

因此，您实际上根本不需要使用SvgIcon，只需创建自己的图标即可。这是我的最终代码：

import { withStyles } from '@material-ui/core';
import React from 'react';

@withStyles(theme => ({
  svg_icon: {
    width: '1em',
    height: '1em',
    display: 'inline-block',
    fontSize: '24px',
    transition: 'fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms',
    flexShrink: 0,
    userSelect: 'none',
  }
}))
export class LawyersIcon extends React.Component {
  render() {
    const { classes } = this.props
    return <div className={classes.svg_icon}>
      <img src="https://pictures-for-website.nyc3.digitaloceanspaces.com/icons/team.svg" />
    </div>
  }

}

如何使用材质为ui的SVG图像创建SVG图标？

1 个答案: