- Vue.js 2 Web Development Projects
- Guillaume Chau
- 72字
- 2021-07-02 22:34:29
The note toolbar with extras inside
Some features are still missing from our app, such as deleting or renaming the selected note. We will add these in a new toolbar, just above the note text editor. Go ahead and create a new p element with the toolbar class ;inside the main section:
<!-- Main pane --> <section class="main"> <p class="toolbar"> <!-- Our toolbar is here! --> </p> <textarea v-model="selectedNote.content"></textarea> </p>
We will add three new features in this toolbar:
- Renaming the note
- Deleting the note
- Marking the note as favorite