Use Array.filter() to Dynamically Filter an Array code not working?

Programming
1

Tell us what’s happening:

its literally the same code from the hints’ it won’t work for some reason

Your code so far


class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      users: [
        {
          username: 'Jeff',
          online: true
        },
        {
          username: 'Alan',
          online: false
        },
        {
          username: 'Mary',
          online: true
        },
        {
          username: 'Jim',
          online: false
        },
        {
          username: 'Sara',
          online: true
        },
        {
          username: 'Laura',
          online: true
        }
      ]
    }
  }
  render() {
const usersOnline = this.state.users.filter(i => i.online == true); // change code here
    const renderOnline = usersOnline.map((i) => <li key={i.username + 1}> {i.username}</li>);


          

    return (
       <div>
         <h1>Current Online Users:</h1>
         <ul>
           {renderOnline}
         </ul>
       </div>
    );
  }
};

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0 Safari/605.1.15.

Link to the challenge:

2

in your const renderOnline line, there’s a space before the username field is rendered. Remove the space.

3 
const usersOnline = this.state.users.filter(i => i.online == true); // change code here
const renderOnline = usersOnline.map((i) => <li key={i.username + 1}> {i.username}</li>);

^ deleted the space , I still get error for `“MyComponent should render li elements that contain the username of each online user.”

4

The space I’m referring to is still there. Inside the li.

const renderOnline = usersOnline.map((i) => <li key={i.username + 1}>{i.username}</li>);

immediately following the closing > for the opening li tag, and the username. Remove THAT, should pass. The test is looking for the li tag to contain ONLY the user name, and yours includes a space, followed by a user name.

5

oh wow! went right over my head. Okay I got it to pass. Thank you :smiley:

6

Very easy mistake to make. Took me a little bit of skull sweat to figure it out. Also, remember that all these test are very very exact in what they want. Doing great, keep it up, and keep on asking! :wink: