Изучаем Props

This commit is contained in:
2026-05-05 19:27:46 +03:00
parent ec325b51bc
commit 8f46470a26
3 changed files with 850 additions and 13 deletions
+830 -9
View File
File diff suppressed because it is too large Load Diff
+2
View File
@@ -10,6 +10,7 @@
"preview": "vite preview" "preview": "vite preview"
}, },
"dependencies": { "dependencies": {
"info": "^1.0.0",
"react": "^19.1.0", "react": "^19.1.0",
"react-dom": "^19.1.0" "react-dom": "^19.1.0"
}, },
@@ -22,6 +23,7 @@
"eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.19", "eslint-plugin-react-refresh": "^0.4.19",
"globals": "^16.0.0", "globals": "^16.0.0",
"sass": "^1.99.0",
"vite": "^6.3.5" "vite": "^6.3.5"
} }
} }
+17 -3
View File
@@ -1,10 +1,24 @@
// удаляем все, оставляя лишь пустую функцию App ниже import styles from './styles/App.module.scss'
function Person({ name, age }) {
return (
<div className={styles.container}>
<p>Имя: {name}</p>
<p>Возраст: {age}</p>
</div>
)
}
function App() { function App() {
const options = {title:'Меню', width: 100, height: 200}
let {width, title, height} = options;
console.log(title);
console.log(width);
console.log(height);
return ( return (
<> <>
{/* Добавьте тестовый контент для проверки */} <Person name="Alex" age={28} />
<h1>Hello, React!</h1> <Person name="Bob" age={35} />
</> </>
) )
} }