import { useState } from "react";
import AddCardList from "../../components/TrelloList/AddCardList/AddCardList";
import TrelloList from "../TrelloList/TrelloList";
import TrelloData from "../../trellodata";
import ContextAPI from "../../ContextAPI";
import { v4 as uuidv4 } from "uuid";
import styles from "./App.module.css";
function App() {
const [data, setData] = useState(TrelloData);
const updateListTitle = (updatedTitle, listId) => {
const list = data.lists[listId];
list.title = updatedTitle;
setData({
...data,
lists: {
...data.lists,
[listId]: list,
},
});
};
const addCard = (title, listId) => {
const newCardId = uuidv4();
const newCard = {
id: newCardId,
title,
};
const list = data.lists[listId];
list.cards = [...list.cards, newCard];
setData({
...data,
lists: {
...data.lists,
[listId]: list,
},
});
};
const addList = (title) => {
const newListId = uuidv4();
setData({
listIds: [...data.listIds, newListId],
list: {
...data.lists,
[newListId]: {
id: newListId,
title,
cards: [],
},
},
});
};
return (
<ContextAPI.Provider value={{ updateListTitle, addCard, addList }}>
<div className={styles.root}>
<div className={styles.container}>
{data.listIds.map((listID) => {
const list = data.lists[listID];
return <TrelloList list={list} key={listID} />;
})}
<div>
<AddCardList type="list" />
</div>
</div>
</div>
</ContextAPI.Provider>
);
}
export default App;
const TrelloData = {
lists: {
"01list": {
id: "01list",
title: "To do",
cards: [
{
id: "01card",
title: "Doing homework",
},
{
id: "02card",
title: "Walking",
},
{
id: "03card",
title: "Cleaning",
},
],
},
"02list": {
id: "02list",
title: "In progress",
cards: [],
},
},
listIds: ["01list", "02list"],
};
export default TrelloData;
-
1ну написано же, нет такого свойства. значит в data.lists может ничего не быть...проверяй– Алексей Шиманский16 июн 2022 в 19:00
Добавить комментарий
|
1 ответ
У Вас опечатка в функции addList
- вместо свойства lists
устанавливается свойство list
.