Group Chat Week 6 Solutions
Well done if you got these right!
-
How do we include the Header component inside of the App component in this code?
- We just need to write a self-closing Header tag in between the div tags of our App component (e.g.
<Header />).
- We just need to write a self-closing Header tag in between the div tags of our App component (e.g.
-
How would we rewrite this code so that we greet different people each time?
- We need to pass a prop of
name=”Mary/Brian/Mike”to each of the Greeting components that we’re rendering. - Then, inside the Greeting component, we need to add our props object to the function argument, and add the props.name to the greeting instead of “World”.
- This should look like:
<h1>Hello {props.name}!</h1>
- We need to pass a prop of
-
Why doesn’t this code work to print the names of 10 users that we’re getting from a server to the screen?
- Whenever we want to update state in a React app, we need to use the
this.setState()method, since component state is immutable. - When we write
this.state.users = dataon line 18, this doesn’t actually update the users array in the component state.
- Whenever we want to update state in a React app, we need to use the
-
What lines do we need to add to this code so that clicking each of the buttons toggles the background color of the screen?
- We need to make a call to
this.setState()to update the value of thebackgroundColorproperty to “blue’ or “red” respectively.
- We need to make a call to