- Vue.js 2 Web Development Projects
- Guillaume Chau
- 109字
- 2021-07-02 22:34:25
The note editor
Now that we have our app running, let's add the text editor. We will use a simple textarea element and the v-model directive we saw in Chapter 1, Getting Started with Vue.
Create a section element and put the textarea inside, then add the v-model directive bound to our content property:
<!-- Main pane --> <section class="main"> <textarea v-model="content"></textarea> </section>
Now, if you change the text ;inside the note editor, the value of content should automatically chance in the devtools.
The v-model directive is not limited to text inputs. You can also use it in other form elements, such as checkboxes, radio buttons, or even custom components, as we will see later in the book.
推薦閱讀
- OpenStack Cloud Computing Cookbook(Third Edition)
- JSP網絡編程(學習筆記)
- Testing with JUnit
- Visual Basic程序開發(學習筆記)
- C# Programming Cookbook
- Python自動化運維快速入門
- PyTorch自然語言處理入門與實戰
- 碼上行動:零基礎學會Python編程(ChatGPT版)
- Java項目實戰精編
- HTML5入門經典
- Node.js全程實例
- Learning JavaScript Data Structures and Algorithms
- Extreme C
- JavaScript應用開發實踐指南
- Python數據可視化之美:專業圖表繪制指南(全彩)