diff --git a/react_form_alap/form/package-lock.json b/react_form_alap/form/package-lock.json index b663c229..cfbd8b0b 100644 --- a/react_form_alap/form/package-lock.json +++ b/react_form_alap/form/package-lock.json @@ -11,7 +11,8 @@ "cra-template": "1.2.0", "react": "^19.0.0", "react-dom": "^19.0.0", - "react-scripts": "5.0.1", + "react-router-dom": "^6.29.0", + "react-scripts": "^5.0.1", "web-vitals": "^4.2.4" } }, @@ -2880,6 +2881,15 @@ } } }, + "node_modules/@remix-run/router": { + "version": "1.22.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.22.0.tgz", + "integrity": "sha512-MBOl8MeOzpK0HQQQshKB7pABXbmyHizdTpqnrIseTbsv0nAepwC2ENZa1aaBExNQcpLoXmWthhak8SABLzvGPw==", + "license": "MIT", + "engines": { + "node": ">=14.0.0" + } + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -12698,10 +12708,43 @@ "node": ">=0.10.0" } }, + "node_modules/react-router": { + "version": "6.29.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.29.0.tgz", + "integrity": "sha512-DXZJoE0q+KyeVw75Ck6GkPxFak63C4fGqZGNijnWgzB/HzSP1ZfTlBj5COaGWwhrMQ/R8bXiq5Ooy4KG+ReyjQ==", + "license": "MIT", + "dependencies": { + "@remix-run/router": "1.22.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/react-router-dom": { + "version": "6.29.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.29.0.tgz", + "integrity": "sha512-pkEbJPATRJ2iotK+wUwHfy0xs2T59YPEN8BQxVCPeBZvK7kfPESRc/nyxzdcxR17hXgUPYx2whMwl+eo9cUdnQ==", + "license": "MIT", + "dependencies": { + "@remix-run/router": "1.22.0", + "react-router": "6.29.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/react-scripts": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz", "integrity": "sha512-8VAmEm/ZAwQzJ+GOMLbBsTdDKOpuZh7RPs0UymvBR2vRk4iZWCskjbFnxqjrzoIvlNNRZ3QJFx6/qDSi6zSnaQ==", + "license": "MIT", "dependencies": { "@babel/core": "^7.16.0", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3", diff --git a/react_form_alap/form/package.json b/react_form_alap/form/package.json index 7b2b3ee9..5785f374 100644 --- a/react_form_alap/form/package.json +++ b/react_form_alap/form/package.json @@ -6,7 +6,8 @@ "cra-template": "1.2.0", "react": "^19.0.0", "react-dom": "^19.0.0", - "react-scripts": "5.0.1", + "react-router-dom": "^6.29.0", + "react-scripts": "^5.0.1", "web-vitals": "^4.2.4" }, "scripts": { diff --git a/react_form_alap/form/src/25_02_04/Adatok.jsx b/react_form_alap/form/src/25_02_04/Adatok.jsx new file mode 100644 index 00000000..a10fb53d --- /dev/null +++ b/react_form_alap/form/src/25_02_04/Adatok.jsx @@ -0,0 +1,16 @@ +function Adatok(props){ + return ( + <> +
{props.user.email}
+{props.user.phone}
+{props.user.job}
+{props.user.language_certificate}
++ {props.user.motivation} +
+ > + ) +} + +export default Adatok; \ No newline at end of file diff --git a/react_form_alap/form/src/25_02_04/Urlap.jsx b/react_form_alap/form/src/25_02_04/Urlap.jsx index 2b51dc04..c6c874fe 100644 --- a/react_form_alap/form/src/25_02_04/Urlap.jsx +++ b/react_form_alap/form/src/25_02_04/Urlap.jsx @@ -1,13 +1,26 @@ import { useState } from "react"; +import Adatok from "./Adatok"; function Urlap(){ const [user, setUser] = useState({motivation: "ide írd a motivációs leveled"}); let feldolgoz = () => { + setUser( + { + ...user, + submitted: true + } + ); + alert(` A user neve: ${user.name} - A user telefonszáma: ${user.phone}`); + A user email címe: ${user.email} + A user telefonszáma: ${user.phone} + A user foglalkozása: ${user.job} + A user nyelvtudása: ${user.language_certificate} + A user motivációs levele: ${user.motivation} + `); } let eventHandling = (event) => { @@ -20,8 +33,9 @@ function Urlap(){ }); } - return ( - + ) + } + + return ( + <> +