Back to tasksGet help with live coding in real time with Sobes Copilot
Junior — Senior
23
Проверка кода React‑компонента App
Companies where asked:
HolyWeb
Task condition
Необходимо выполнить ревью React‑компонента. Оценить правильность вывода информации, корректность использования свойства key, порядок сортировки данных и возможные места для оптимизации.
import "./styles.css";
import { Person } from "./Person";
import { useEffect, useState } from "react";
const people = [
{
id: 2,
name: "Виктор",
lastName: "Вью",
age: 26,
},
{
id: 3,
name: "Константин",
lastName: "Ангулрин",
age: 20,
},
{
id: 1,
name: "Илия",
lastName: "Реактова",
age: 23,
},
];
export default function App() {
const now = new Date().toLocaleTimeString();
const [currentTime, setCurrentTime] = useState(now);
const personsList = people.map(({ name, lastName, id }) => (
<Person key={id} name={name} lastName={lastName} id={id} />
));
useEffect(() => {
setInterval(() => setCurrentTime(new Date().toLocaleTimeString()), 1000);
}, []);
console.log("render App");
return (
<div className="App">
Time: {now}
{personsList}
</div>
);
}