好的，看起来“ Users.js”应该是：
import React from 'react';class Users extends React.Component { render() { let friends = this.props.list.filter( function (user) { return user.friend === true }); let nonFriends = this.props.list.filter( function (user) { return user.friend !== true }); return ( <div> <h1>Friends:</h1> <ul> {friends.map(function (user) { return <li key={user.name}>{user.name}</li> })} </ul> <h1>Non Friends:</h1> <ul> {nonFriends.map(function (user) { return <li key={user.name}>{user.name}</li> })} </ul> </div> ); }}export default Users;甚至这个：
import React from 'react';class Users extends React.Component { render() { return ( <div> <h1>Friends:</h1> <ul> {this.props.list.filter(function (user) { // filter first for friends return user.friend === true // returns a new array }).map(function (user) { // map the new array to list items return <li key={user.name}>{user.name}</li> // don't forget unique key for each item })} </ul> <hr /> <h1>Non Friends:</h1> <ul> {this.props.list.filter(function (user) { // filter first for non-friends return user.friend !== true // returns a new array }).map(function (user) { //map the new array to list items return <li key={user.name}>{user.name}</li> // don't forget unique key for each item })} </ul> </div> ); }}export default Users;
