Intro to One-Page CRUD Tutorial
1:34
Creating a Tags Admin Page (CRUD: READ)
4:15
Inline Editing (CRUD Update)
10:28
Deleting Tags (CRUD Delete)
4:34
Adding Tags, Inline (CRUD Create)
7:45
Review
5:02
0% done with Complete CRUD in ONE page - includes inline editing

Chapter 12 of 27 in Building VueScreencasts.com
Inline Editing (CRUD Update)

The user wants to change the name of a tag, but without going to a new screen. Our solution is to let them click on the name and have it turn immediately into an editable text field.

The Vuex implementation doesn't contain any surprises, but the UI for this is interesting. Our solution involves learning new events, then using setTimeout/$nextTick to make sure stuff happens in the right order.

What do others think of VueScreencasts?
"Thank you! Really digging your videos!"
—Lars Sørensen
"Great work man."
—The Nerdy Dev
"Thanks Jeffrey, great lessons with so much content and new concepts! Can't wait for the next ones."
—Bairre G
"Thanks so much! Helped a lot."
—BoIoko
Take your career to the next level