7 - Todo List

scrimba

Watch in fullscreen

7 - Todo List

by Jelyn

About

Comments

Notes

7 - Todo List

by Jelyn

Expand for more info

App.js

run

preview

console

import React from "react";
import TodoItem from "./TodoItem";
import todosData from "./todosData";

function App () {
    // const todoItems = todosData.map(function (item) {
    //     <TodoItem item={item}/>
    // });
    
    const todoItems = todosData.map(item => <TodoItem item={item}/>)
    return(
        <div className="todo-list">
            {todoItems}
        </div>
    )
}

export default App;

import React from "react";

import TodoItem from "./TodoItem";

import todosData from "./todosData";

function App () {

// const todoItems = todosData.map(function (item) {

// <TodoItem item={item}/>

// });

const todoItems = todosData.map(item => <TodoItem item={item}/>)

return(

{todoItems}

</div>

)

}

export default App;

"Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `App`. See https://fb.me/react-warning-keys for more information. in TodoItem (created by App) in App"

›

{item:

{id:

, text:

"kain"

, completed:

true

}

›

{item:

{id:

, text:

"tulog"

, completed:

false

}

›

{item:

{id:

, text:

"Code"

, completed:

false

}

LIVE