Rendering todo items
It's the job of the TodoList
component to render items todo list. When AddTodoMutation
takes place, the TodoList
component needs to be able to render this new item. Relay takes care of updating the internal data stores where all of our GraphQL data lives. Here's a look at the item list again, with several more todos added:
Here's the TodoList
component itself:
import React, { PropTypes } from 'react'; import Relay from 'react-relay'; import { View } from 'react-native'; import Todo from './Todo'; // The list component itself is quite simple. Note the // property that we're using to iterate over - there's // "edges" and "nodes". This is reflective of a GraphQL // collection. const TodoList = ({ viewer }) => ( <View> {viewer.todos.edges.map(edge => ( <Todo key={edge.node.id} todo={edge.node} viewer={viewer} />...