Arrays and Keys

Keys help React identify which elements have been changed, added, or removed throughout each render.

type movie = {title: string, desc: string} let movies = [{title: "Dark", desc: "scifi"}, {title: "Looper", desc: "scifi"}] module Movie = { @react.component let make = (~title: string, ~desc: string) => { <div> <h1> {title->React.string} </h1> <p> {desc->React.string} </p> </div> } } @react.component let make = () => { <div> { movies ->Belt.Array.map(({title, desc}) => <Movie key={title} title desc />) ->React.array } </div> }