As it happened with the ShoppingList screen, we want the user to be able to interact with our AddProduct component, so we will add some event handlers to respond to some user actions.
Our render method should then look something like this:
/*** AddProduct.js ***/...render() { return ( <Container> <Content> <List> {this.state.allProducts.map(product => { const productIsInList = this.state.productsInList. find(p => p.id === product.id); return ( <ListItem key={product.id} onPress={this._handleProductPress.bind (this, product)} > <Body> <Text style={{ color: productIsInList? '#bbb' : '#000' }} > {product.name} </Text> { productIsInList && <Text note> {'Already in shopping list'} </Text> } </Body> <Right> <Icon ios="ios-remove-circle" ...