From 1c82ff9428de329a65033b4084c07db7a8d7b809 Mon Sep 17 00:00:00 2001 From: yb <1728066681@qq.com> Date: Sat, 5 Jun 2021 17:15:45 +0800 Subject: [PATCH 1/2] =?UTF-8?q?Vue=E8=AF=BE=E5=A0=82=E7=AC=94=E8=AE=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Vue - 2021.06.05.md" | 84 +++++++++++++++++++ .../Vue/ind6-5.html" | 78 +++++++++++++++++ 2 files changed, 162 insertions(+) create mode 100644 "\346\242\201\350\211\272\347\274\244/Vue - 2021.06.05.md" create mode 100644 "\346\242\201\350\211\272\347\274\244/Vue/ind6-5.html" diff --git "a/\346\242\201\350\211\272\347\274\244/Vue - 2021.06.05.md" "b/\346\242\201\350\211\272\347\274\244/Vue - 2021.06.05.md" new file mode 100644 index 0000000..7c086eb --- /dev/null +++ "b/\346\242\201\350\211\272\347\274\244/Vue - 2021.06.05.md" @@ -0,0 +1,84 @@ +## Vue.js 第五节课 (表单输入绑定) + +### 表单输入绑定 + +#### v-model指令   + ++ 用 v-model 指令在表单 input、textarea 及 select 元素上创建双向数据绑定。 + ++ v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值而总是将 Vue 实例的数据作为数据来源 +#### 基础用法 + +1. v-model 在内部为不同的输入元素使用不同的属性并抛出不同的事件: + ++ text 和 textarea 元素使用 value 属性和 input 事件; ++ checkbox 和 radio 使用 checked 属性和 change 事件; ++ select 字段将 value 作为 prop 并将 change 作为事件。 + +代码如下(in6-5html) +``` +
+ + +
+
+ +
+

{{msg}}

+

good

+

lisa

+ +
+ + + + good nice: {{ checkedNames }} +
+
+ + + + + +
+ 你是:{{picked}} +
+ + +
+ Lisa:{{green}} +
+ +
+ + +``` +``` + +``` \ No newline at end of file diff --git "a/\346\242\201\350\211\272\347\274\244/Vue/ind6-5.html" "b/\346\242\201\350\211\272\347\274\244/Vue/ind6-5.html" new file mode 100644 index 0000000..76cad30 --- /dev/null +++ "b/\346\242\201\350\211\272\347\274\244/Vue/ind6-5.html" @@ -0,0 +1,78 @@ + + + + + + + Document + + + +
+ + +
+
+ +
+

{{msg}}

+

good

+

lisa

+ +
+ + + + good nice: {{ checkedNames }} +
+
+ + + + + +
+ 你是:{{picked}} +
+ + +
+ Lisa:{{green}} +
+ +
+ + + + + + + + + -- Gitee From cc72f631c169cfa717029c492b42b5a8269ded22 Mon Sep 17 00:00:00 2001 From: yb <1728066681@qq.com> Date: Sat, 5 Jun 2021 17:35:10 +0800 Subject: [PATCH 2/2] =?UTF-8?q?Vue=E8=AF=BE=E5=A0=82=E7=AC=94=E8=AE=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Vue/6-5.html" | 81 +++++++++++++++++++ 1 file changed, 81 insertions(+) create mode 100644 "\346\242\201\350\211\272\347\274\244/Vue/6-5.html" diff --git "a/\346\242\201\350\211\272\347\274\244/Vue/6-5.html" "b/\346\242\201\350\211\272\347\274\244/Vue/6-5.html" new file mode 100644 index 0000000..e35f049 --- /dev/null +++ "b/\346\242\201\350\211\272\347\274\244/Vue/6-5.html" @@ -0,0 +1,81 @@ + + + + + + 6.5 + + + +
+ + +
+ + + + + lisa:{{ checked }} +
+ 男 + 女 + lisa:{{picked}} + +
+ + {{ selected }} +
+ +
+ +
+ Selected: {{ selected }} +
+
+ + + + + + + + + + + + +
+ + + + + + \ No newline at end of file -- Gitee