c

作者: zhanuzakkk创建于 2025年5月29日更新于 2025年5月29日
import React, { useState } from "react"; import { Droppable } from "react-beautiful-dnd"; import Task from "./Task"; export default function Column({ column, tasks, data, setData }) { const [newTaskContent, setNewTaskContent] = useState(""); const addTask = () => { if (!newTaskContent.trim()) return; const taskId = `task-${Date.now()}`; const newTask = { id: taskId, content: newTaskContent }; const newState = { ...data, tasks: { ...data.tasks, [taskId]: newTask }, columns: { ...data.columns, [column.id]: { ...column, taskIds: [...column.taskIds, taskId], }, }, }; setData(newState); setNewTaskContent(""); }; return (

{column.title}

{(provided) => (
{tasks.map((task, index) => ( ))} {provided.placeholder}
)} setNewTaskContent(e.target.value)} placeholder="Новая задача" style={{ width: "100%", marginTop: "8px" }} />
); }

内容来源: atlassian/react-beautiful-dnd