<template
>
<
div
id>
<
label
for="mytxt"
>
input-text:
<
input
id="mytxt"
type
="text"
v-model
="myvalue"
>
myvalue:}
label
>
div>
template
>
.lazy
在預設情況下，v-model在每次input事件觸發後將輸入框的值與資料進行同步 (除了上述輸入法組合文字時)。你可以新增lazy修飾符，從而轉變為使用change事件進行同步：
<template
>
<
div
id>
沒有lazy修飾符：
<
input
id="mytxt"
type
="text"
v-model
="myvalue1"
>
myvalue1:}
<
br>
有lazy修飾符：
<
input
id="mytxt"
type
="text"
v-model.lazy
="myvalue2"
>
myvalue2:}
div>
template
>
頁面效果：
.number
如果想自動將使用者的輸入值轉為數值型別，可以給v-model新增number修飾符：
這通常很有用，因為即使在type="number"時，html 輸入元素的值也總會返回字串。
<template
>
<
div
id>
沒有number修飾符：
<
input
id="mytxt"
type
="text"
v-model
="myvalue1"
>
}<
br>
有number修飾符：
<
input
id="mytxt"
type
="text"
v-model.number
="myvalue2"
>}
div>
template
>
頁面效果：
.trim
如果要自動過濾使用者輸入的首尾空白字元，可以給v-model新增trim修飾符：
<template
>
<
div
id>
沒有trim修飾符：
<
input
id="mytxt"
type
="text"
v-model
="myvalue1"
>
myvalue1:}
<
br>
有trim修飾符：
<
input
id="mytxt"
type
="text"
v-model.trim
="myvalue2"
>
myvalue2:}
div>
template
>
頁面效果：
<template
>
<
div
id>
input-checkbox:
<
template
v-for
="items in mydata"
>
<
input
type
="checkbox"
v-model
="mybox"
:value
="items.id"
>
}
template
>
mybox:}
div>
template
>
<template
>
<
div
id>
input-radio:
<
template
v-for
="items in mydata"
>
<
input
type
="radio"
v-model
="myradio"
:value
="items.id"
>
}
template
>
myradio:}
div>
template
>
<template
>
<
div
id>
<
select
v-model
="myselect"
>
<
option
value
="0"
>請選擇
option
>
<
template
v-for
="items in mydata"
>
<
option
:value
="items.id"
>}
option
>
template
>
select
>
myselect:}
div>
template
>
vue2 0中v on繫結自定義事件
vue中父元件通過prop傳遞資料給子元件，而想要將子元件的資料傳遞給父元件，則可以通過自定義事件的繫結。每個vue例項都實現了 事件介面 即 1 使用 on eventname 監聽事件 2 使用 emit eventname 觸發事件 父元件可以在使用子元件的地方直接用 v on 來監聽子元件觸...
vue事件繫結和表單
1 v on click additem 寫在methods裡面，用this定義全域性獲取data裡的資料，this.list，可以簡寫為 click additem 有乙個stop的修改器，可以阻止事件冒泡 2 v on keydown.enter additem 按下enter的時候觸發事件 3...
vue2 0父子元件雙向繫結
父元件 如下。這裡要注意的有 1.父組建使用msg向子元件傳遞資料。2.子附件向父附件傳送 訊息，父元件收到訊息後用abc方法來處理。type text v model msg inputvalue msg v on abc child div template style import child...