vue# form Control Bindings

Use V-model to implement data two-way binding on form controls.

Radio: https://jsfiddle.net/miloer/bs49p0fx/

<input type= "checkbox" id= "checkbox" v-model= "checked" ><label for= "checkbox" >{{checked}}</label>

　　

Multiple tick: https://jsfiddle.net/miloer/bs49p0fx/1/

Binding multiple elements, and finally through the Vue filter, in JSON format, output. I think it's pretty classy.

#radio <input type= "Radio" id= "one" value= "one" v-model= "picked" ><label for= "one" >One</label>< Br><input type= "Radio" id= "both" value= "" "v-model=" Picked "><label for=" both ">Two</label>< Br><span>picked: {{Picked}}</span> #select <select v-model= "selected" >  <option selected >A</option>  <option>B</option>  <option>C</option></select>< Span>selected: {{Selected}}</span>

　　

https://jsfiddle.net/miloer/bs49p0fx/2/combined above, with v-for rendering, dynamic to bind a small example, I think this, or very useful, remember just go to college that will, learn. NET, The teacher has once homework to let everybody complete similar function.

Value bindings:

Sometimes we want to bind a value to a dynamic property on the Vue instance. Can be used to v-bind do. And v-bind allows you to bind the value of the input box to a non-string value.

<input type= "checkbox" v-model= "Toggle" v-bind:true-value= "a" v-bind:false-value= "B" >

　　

parameter characteristics:

Check Vm.toggle = = = vm.a//Uncheck Vm.toggle = = = Vm.b

　　

Lazy: By default, the v-model input input box values and data are synchronized in the event, and you can add an attribute lazy that changes to change synchronize in the event

Number: Keep the user's input as a digit

Debounce: Set a minimum delay, which the official mentions is useful if each update is going to be highly consumable (for example, an AJAX request in the input prompt).

<v-model=debounce=">   "

vue# form Control Bindings