This commit is contained in:
njord 2023-05-24 21:02:12 +02:00
parent 8f2aa45ea7
commit 2c9043428c
4 changed files with 54 additions and 3 deletions

View File

@ -3,13 +3,14 @@ import "./App.css";
import Header from "./Header";
import Content from "./Content";
import Footer from "./Footer";
import { Menu } from "./Menu";
import { Button } from "./Button";
function App() {
const menu = ["Uvod", "O nas", "Kontakt", "test"];
return (
<>
<Header />
<Content />
<Footer />
<Menu menu={menu} nadpis="ReactGirls" />
</>
);
}

8
src/Button.js Normal file
View File

@ -0,0 +1,8 @@
import React from "react";
export const Button = ({ children, onClick }) => {
// const handleClick = () => {
// console.log("klikl jsi");
// };
return <button onClick={onClick}>{children}</button>;
};

View File

@ -1,4 +1,5 @@
const Content = () => {
//JSX code
return <div>Content 1</div>;
};
export default Content;

41
src/Menu.js Normal file
View File

@ -0,0 +1,41 @@
import React from "react";
import { Button } from "./Button";
export const Menu = (props) => {
const menu = props.menu;
const nadpis = props.nadpis;
// const {menu, nadpis} = props;
//const menu = ["Uvod", "O nas", "Kontakt"];
//const menu = [];
// if (menu.length === 0) {
// return <p>Menu je prazdne</p>;
// }
const handleAddMenu = () => {
console.log("pridal jsi menu");
};
const handleDeleteMenu = () => {
console.log("smazal jsi menu");
};
return (
<nav>
<h1>{nadpis}</h1>
{menu.length === 0 ? (
<p>Menu je prazdne</p>
) : (
<ul>
{menu.map((item) => (
<li key={item}>{item}</li>
))}
</ul>
)}
<Button onClick={handleDeleteMenu}>Delete</Button>
<Button onClick={handleAddMenu}>Add</Button>
</nav>
);
};