v2 Delta 1.3

Better data passing design

Author: yunusparvezkhan

src/components/TaskCard.js

@@ -1,9 +1,9 @@
 import React from 'react';
 
-const TaskCard = ({ id, title }) => {
+const TaskCard = ({ task }) => {
     return (
         <div>
-            <div key={id}>{id}. {title}</div>
+            <div key={task.id}>{task.id}. {task.title}</div>
         </div>
     )
 }

src/components/TaskList.js

@@ -5,7 +5,7 @@ const TaskList = ({ tasks }) => {
     const renderTask = tasks.map((task) => {
         return (
             // <div key={task.id}>{task.id}. {task.title}</div>
-            <TaskCard id={task.id} title={task.title} />
+            <TaskCard key={task.id} task={task} />
         )
     })
     return (