Frontend óra (2024. 12. 10.)

2024. 12. 10/test/src/Auto.js

@@ -1,15 +1,15 @@
 import React from "react";
+import { useState } from "react";
 
-class Auto extends React.Component {
-    render() {
-        return (
-            <>
-                <p>Autó</p>
-                <p>Piros</p>
-                <pre>Lada</pre>
-            </>
-        )
-    }
+function Auto() {
+    let [szin, setSzin] = useState()
+    setSzin("szia")
+    return (
+        <>
+            <p>Autó tulajdonságok:</p>
+            <p>Az autó színe: {szin} </p>
+        </>
+    )
 }
 
 export default Auto

2024. 12. 10/test/src/index.js

@@ -1,14 +1,15 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
-import App from './App';
+// import App from './App';
 import Auto from "./Auto"
 import reportWebVitals from './reportWebVitals';
-
+let auto1 = {szin: "narancs", marka: "Suzuki"}
+let auto2 = {szin: "vörös", marka: "Fiat"}
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(
   <React.StrictMode>
-    <Auto />
+    <Auto auto1={auto1} auto2={auto2}/>
   </React.StrictMode>
 );