ReactJS - '@ material-ui / icons / Fastfood' не работает - PullRequest
Новая
       1

ReactJS - '@ material-ui / icons / Fastfood' не работает

0 голосов
/ 25 июня 2019

ReactJS - '@ material-ui / icons / Fastfood' не работает.

Header.js 

import React, { Component } from 'react';
import './Header.css';
import Fastfood from '@material-ui/icons/Fastfood';

class Header extends Component {

render() {  
    return(
        <div>
            <header className="app-header">
                <div className="app-logo">
                    <i class="material-icons">Fastfood</i>
                </div>
            </header>
        </div>
    )
}
export default Header;

Header.css 

.app-header {
background-color: #263238;
padding: 16px 16px 16px 16px;
display: flex;
align-items: center;
justify-content: space-between;
}

.app-logo{
color: #fff;
font-size: 18px;
text-decoration: none;
}

package.json 

{
  "dependencies": {
    "@material-ui/core": "^4.1.2",
    "@material-ui/icons": "^4.2.1",
"@material-ui/styles": "^4.1.2",
"moment": "^2.24.0",
"react": "^16.8.0",
"react-dom": "^16.8.0",
"react-scripts": "^3.0.1"
  },
}

Значок быстрого питания SVG не отображается настраница.Заголовок просто показывает текст «фастфуд» вместо логотипа.

1 Ответ

0 голосов
/ 25 июня 2019

Я изменил функцию рендеринга, как показано ниже, чтобы решить эту проблему. 

render() {  
    return(
        <div>
            <header className="app-header">
                    <Fastfood className='app-logo'/>
            </header>
        </div>
    )
}
...