v model指令以及相關知識點

可以在表單元素上建立雙向資料繫結。即資料更新元素更新、元素更新資料也會更新。

本質上v-model為語法糖

元素型別

屬性事件

input[type=text]、textarea

value

input

input[checkbox]、input[radio]

checked

change

select

value

change

>
v-model
="message"
>
>
message 為: }p
>
div>

const vm =
newvue(}
)

單個核取方塊

繫結到布林值，v-model=「boolean」

>
type
="checkbox"
id="checkbox"
v-model
="checked"
/>
for=
"checkbox"
>
}label
>
div>

const vm =
newvue(}
)

多個核取方塊

繫結到同乙個陣列，v-model=「array」

陣列中的值為被選中的input框value值

>
type
="checkbox"
id="cheng"
value
="成哥"
v-model
="checkednames"
>
for=
"cheng"
>
小明label
>
type
="checkbox"
id="deng"
value
="鄧哥"
v-model
="checkednames"
>
for=
"deng"
>
小張label
>
label
>
type
="checkbox"
id="tong"
value
="思彤哥"
v-model
="checkednames"
>
for=
"tong"
>
小劉label
>
>
>
被選中的人有: }span
>
div>

const vm =
newvue(}
)

被繫結的資料和value同步

>
type
="radio"
id="cheng"
value
="小明"
v-model
="picked"
>
for=
"cheng"
>
小明label
>
type
="radio"
id="deng"
value
="小張"
v-model
="picked"
>
for=
"deng"
>
小張label
>
type
="radio"
id="tong"
value
="小劉"
v-model
="picked"
>
for=
"deng"
>
小劉label
>
>
>
被選中的人: }span
>
div>

const vm =
newvue(}
)

>
>
多行文字為：}p
>
v-model
="message"
placeholder
="新增文字"
>
textarea
>
div>

const vm =
newvue(}
)

匹配的值為option中的漢字

>
v-model
="selected"
>
>
aoption
>
>
boption
>
>
coption
>
select
>
>
選擇: }span
>
div>

const vm =
newvue(}
)

注意：如果 v-model 表示式的初始值未能匹配任何選項，元素將被渲染為「未選中」狀態。在 ios 中，這會使使用者無法選擇第乙個選項。因為這樣的情況下，ios 不會觸發 change 事件。因此，可以提供乙個值為空的禁用選項：

>
v-model
="selected"
>
:disabled
="selected"
>
請選擇option
>
>
aoption
>
>
boption
>
>
coption
>
select
>
>
選擇: }span
>
div>

繫結到乙個陣列

>
v-model
="selected"
multiple
>
>
aoption
>
>
boption
>
>
coption
>
select
>
>
選擇: }span
>
div>

const vm =
newvue(}
)

在預設情況下，v-model在每次input事件觸發後將輸入框的值與資料進行同步。如果要變為使用change事件同步可以新增lazy修飾符：


v-model.lazy
="msg"
>

自動將使用者的輸入值轉為數值型別：

v-model.number
="age"
type
="number"
>

自動過濾使用者輸入的首尾空白字元：

v-model.trim
="msg"
>

Camera相關知識點

1 camera涉及到的概念 1.1 preview capture video preview 預覽 capture 拍照 video 錄影 1.2 幀率快門幀率 frame rate 用於測量顯示幀數的量度。所謂的顯示單位為每秒顯示的幀數，簡稱fps或hz 快門 shutter。快門是攝像器...

CURL相關知識點

1，建立乙個curl的會話資源 ch curl init 設定url，引數傳遞出來的時候 curl setopt ch,curlopt url,url 使用post提交的資料 curl setopt ch,curlopt post,1 if post data 設定是否將響應結果存入變數，1或者tr...

v model指令以及相關知識點

相關知識點

Camera相關知識點

CURL相關知識點

相關推薦