[英]Why is my react app displaying a blank screen after importing and using an icon from material ui despite compiling successfully in my console?
這是代碼,它運行良好,直到我添加了“頭像”行。 我不得不使用反應圖標而不是材料 UI,因為它沒有顯示。 我也很感激我可以安裝一個替代 package,它可以讓我使用 Avatar 組件。 提前致謝。
import React from 'react';
import { MdOutlineMenu } from 'react-icons/md';
import { FiSearch } from 'react-icons/fi';
import { MdVideoCall } from 'react-icons/md';
import { GrApps } from 'react-icons/gr';
import { IoIosNotifications } from 'react-icons/io';
import Avatar from '@material-ui/core/Avatar';
function header() {
return (
<div className='header'>
<h1>I am a header</h1>
<MdOutlineMenu />
<img className='header__logo'
src="https://imgs.search.brave.com/0Adz0eT0KyLAofHJ_wU_1-
GqmHa0rnORMw9GWm__p0Q/rs:fit:844:225:1/g:ce/aHR0cHM6Ly90c2U0
/Lm1tLmJpbmcubmV0/L3RoP2lkPU9JUC5f/SWZFYVVzc2paUXda/MXU5MmIxX0dnSGFF
/SyZwaWQ9QXBp" alt="" />
<input type="text" />
<FiSearch />
<MdVideoCall />
<GrApps />
<IoIosNotifications />
<Avatar alt="Remy Sharp" src="https://avatars2.githubusercontent.com/u/24712956?
s=400&u=b71527e605ae1b748fc2d4157a842e57e427ad44&v=4"/>
</div>
);
}
export default header;
作為 material-ui 的替代品,您可以簡單地使用 react-avatar。它可以使用 NPM 輕松安裝到您的應用程序中。 在此處找到本文中的說明 - https://www.npmjs.com/package/react-avatar 。
我仍然無法弄清楚為什么 material-ui 給了我一個空白屏幕。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.