import React from 'react';
// import './Footer.css';
export default function Footer() {
return (
<Footer>
{/* <p href= ''><i class='fa-brands fa-square-github' ></i></p> */}
<p href='https://github.com/Zac0088'><i class='fa-brands fa-linkedin' ></i></p>
<p href='https://github.com/Zac0088'><i class='fa-brands fa-discord' ></i></p>
</Footer>
);
}
我试图启动我的react应用程序,当我做NPM启动应用程序编译,但chrome不会加载应用程序,只是给我错误代码:内存不足。当我从文件夹容器中删除页脚标签时,它与页脚有关,但我得到了上面的错误。
import React, { useState } from 'react';
import NavTabs from './NavTabs';
import Home from './pages/Home';
import Projects from './pages/Projects'
// import About from './pages/Home';
import Resume from './pages/Resume';
import Contact from './pages/Contact';
import Footer from './Footer';
export default function PortfolioContainer() {
const [currentPage, setCurrentPage] = useState('Home');
// This method is checking to see what the value of `currentPage` is. Depending on the value of currentPage, we return the corresponding component to render.
const renderPage = () => {
if (currentPage === 'Home') {
return <Home />;
}
if (currentPage === 'Projects') {
return <Projects />;
}
if (currentPage === 'Resume') {
return <Resume />;
}
return <Contact />;
};
const handlePageChange = (page) => setCurrentPage(page);
return (
<div>
<div className="portfolio-container">
{/* We are passing the currentPage from state and the function to update it */}
<NavTabs currentPage={currentPage} handlePageChange={handlePageChange} />
{/* Here we are calling the renderPage method which will return a component */}
{renderPage()}
</div>
<Footer />
</div>
);
}
1条答案
按热度按时间x0fgdtte1#
您正在调用函数
Footer
本身,从而导致无限循环。当Footer组件呈现时,您返回的是
<Footer>
,这实际上是同一个函数,它会导致Footer一遍又一遍地呈现自己,直到浏览器耗尽存储所有这些内容的空间。您可能希望使用
<footer>
HTML元素。