From af7c08f8260bc09601df143c88c00ace84315cd5 Mon Sep 17 00:00:00 2001 From: zhaoshuangshi Date: Thu, 9 Feb 2023 17:11:04 +0800 Subject: [PATCH] =?UTF-8?q?1-5=E4=B8=8B=E9=9D=A2=E5=B0=8F=E8=8A=82?= =?UTF-8?q?=E4=B9=A0=E9=A2=98=E6=9B=B4=E6=8D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../5.v-model/1.v-model/exercises.md" | 58 ++----------------- .../exercises.md" | 14 ----- 2 files changed, 4 insertions(+), 68 deletions(-) diff --git "a/data/1.Vue\345\210\235\351\230\266/5.v-model/1.v-model/exercises.md" "b/data/1.Vue\345\210\235\351\230\266/5.v-model/1.v-model/exercises.md" index ea0847b..ebe9e94 100644 --- "a/data/1.Vue\345\210\235\351\230\266/5.v-model/1.v-model/exercises.md" +++ "b/data/1.Vue\345\210\235\351\230\266/5.v-model/1.v-model/exercises.md" @@ -1,71 +1,21 @@ # v-model - 
小常识：
- - v-model 指令我们大家很熟悉了吧，该指令可以在表单 input、textarea 及 select 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇，但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一些特殊处理。 -v-model 会忽略所有表单元素的 value、checked、selected attribute 的初始值而总是将 Vue 实例的数据作为数据来源。你应该通过 JavaScript 在组件的 data 选项中声明初始值。 - -**文本框** -下面代码中p标签的值会根据上方文本框输入的值的改变而改变。 - -```html - -

Message is: {{ message }}

-``` -**复选框** - -```html - - -``` -多个复选框 - -```html - - - - - - -
-Checked names: {{ checkedNames }} -``` -**选择框** - -```html -
- - Selected: {{ selected }} -
-``` -上面只是为大家举了几个小案例，当然我们v-model绑定的值一定是我们在data中定义好的！ - -
- - 
小测试：
- - 下列关于 v-model 的说法，哪项是不正确的？

## 答案 -v-model 是内置指令，不能用在自定义组件上 +v-model 是内置指令，不能用在自定义组件上。 ## 选项 ### A -v-model 能实现双向绑定 +v-model 能够在表单控件或者组件上创建双向绑定。 ### B -v-model 本质上是语法糖，它负责监听用户的输入事件以更新数据 +v-model 本质上是语法糖，随表单控件类型不同而不同。 ### C -对 input 使用 v-model，实际上是指定其 :value 和 @input +对 input 使用 v-model，实际上是指定其 :value 和 @input。 diff --git "a/data/1.Vue\345\210\235\351\230\266/5.v-model/2.v-model\347\273\221\345\256\232\344\277\256\351\245\260\347\254\246/exercises.md" "b/data/1.Vue\345\210\235\351\230\266/5.v-model/2.v-model\347\273\221\345\256\232\344\277\256\351\245\260\347\254\246/exercises.md" index 480251a..9edf520 100644 --- "a/data/1.Vue\345\210\235\351\230\266/5.v-model/2.v-model\347\273\221\345\256\232\344\277\256\351\245\260\347\254\246/exercises.md" +++ "b/data/1.Vue\345\210\235\351\230\266/5.v-model/2.v-model\347\273\221\345\256\232\344\277\256\351\245\260\347\254\246/exercises.md" @@ -1,19 +1,5 @@ # v-model修饰符 - 
小常识：
- -上节我们看到了v-model的运用，那么他还有一些灵活的修饰符可以配合使用，下面就是v-model常用的修饰符 - -
![在这里插入图片描述](https://img-blog.csdnimg.cn/46370cb4f4714ce69acf35b8c330f135.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5Yeg5L2V5b-D5YeJ,size_20,color_FFFFFF,t_70,g_se,x_16) -
-
![在这里插入图片描述](https://img-blog.csdnimg.cn/0df780c7de4743c0a4285550e4f6d5f2.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA5Yeg5L2V5b-D5YeJ,size_20,color_FFFFFF,t_70,g_se,x_16) -
- - -
- - 
小测试：
- 下列不属于v-model修饰符的是？

-- GitLab