Exercise 14. Keys - hangs when i Run

[bitblaster11780]

Exercise 14

Hangs (circle) when i click Run. From the prev post in the Forum, am using the line:

return <li key={"person_" + i}> {person}</li>;

[abergquist]

Doesn't hang for me but neither does it (but should) show the unordered list to/on the right when I click on [Run].

Here's my entire app.js:

var React = require('react');
var ReactDOM = require('react-dom');

var people = ['Rowe', 'Prevost', 'Gare'];

var peopleLIs = people.map(function(person, i) {
  // return statement goes here:
return <li key={'person_' + i}>{person}</li>;
});

// ReactDOM.render goes here:
ReactDOM.render(<ul>{peopleLIs}</ul>, document.getElementById('app'));

Replacing the apostrophes in Line # 8 with double quotes doesn't work either:

return <li key={"person_" + i}>{person}</li>;

nor does:

return <li key={'person-' + i}>{person}</li>;

nor does:

return <li key={"person-" + i}>{person}</li>;

Problem occurs both in Chrome as well as I.E. as well as Firefox for me.

The plot thickens; the above code works fine in "13. .map in JSX" but not in "14. Keys" ...

[toddem]

@abergquist - I'm in the same boat - still spinning as I type. So i'm still working on how to repair my code.

One thing you might try is removing the semi-colon at the end of your

in Line 8.

I think that the the ; at the end of Line 9 is the only one needed.

Good Luck.

[toddem]

@abergquist Yikes! - I tested Line 8 with a ; and it runs! Sorry about my previous post.

Here's a snippet of my code:

var peopleLIs = people.map(function(person, i){
  // return statement goes here:
return <li key={'person_' + i}>{person}</li>;
});

[abergquist]

Yes; since it's JavaScript, the semicolon at the end of the line should work fine.

Very strange; here's my latest code

var React = require('react');
var ReactDOM = require('react-dom');

var people = ['Rowe', 'Prevost', 'Gare'];

var peopleLIs = people.map(function(person, i) {
  // return statement goes here:
  return <li key={'person_' + i}>{person}</li>;
});

// ReactDOM.render goes here:
ReactDOM.render(<ul>{peopleLIs}</ul>, document.getElementById('app'));

It still doesn't show anything (a browser with the results) when I [Run] Exercise 14 whereas other exercises display a browser on the right with the results.

[gigajumper54298]

Same here the console just hangs. Been suck on lesson 14 for about 30 mins.

[abergquist]

Same if you try other browsers, too?

[gigajumper54298]

Honestly I only tried it on Chrome. I only use one Browser despite the fact that I'm a professional web developer. Anyhow, it seems to be random. Not 2 minutes after I posted this message it began working again.

[chipsolver64026]

Yes, I also got stuck

[system]

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.