Join Eve Porcello for an in-depth discussion in this video Adding state to the note component, part of Learning React.js (2016).
- [Instructor] When we last left off with our note,…we added some custom events to the component,…so that when I click on edit, we see an alert,…when I click on remove, we see an alert as well.…In this video, we're going to incorporate state…using get initial state, and set state.…The goal here is when I click on edit,…I should see a form,…and then when I click on save on the form,…I should see the note.…Let's get started with this by adding the…get initial state function to our class.…
We're going to say get initial state.…Here, we're going to return the initial state of the app.…When my app loads, I want to see the note,…so we're going to say editing is false.…Great.…The next thing I want to do is I want to…adjust our edit function so that I say…this dot set state, editing is true.…Every time the edit method is called,…we're going to set the state to true.…
Next up, I want to create a method for save.…Save is going to be, again,…that button on the form that changes the editing state…back to false, and displays the note.…
- What is React.js?
- Introducing JSX
- Creating a React component
- Handling events
- Using state
- Working with PropTypes
- Adding child elements
- Mounting and updating components
- Creating a React.js app
Skill Level Beginner
Building a Web Interface with React.jswith Ray Villalobos1h 21m Intermediate
1. What Is React.js?
2. Getting Started
3. React Components
4. Props and State
5. Enhancing Components
6. Creating an App
Using create-react-app4m 38s
Next steps1m 4s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.