Vue.js study notes six v-model two-way data binding

V-bind said before instruction, data can be bound, but is one-way, from binding to View model, described below v-model, the data can be two-way binding

<div ID = " divApp " > 
        <P> {{MSG}} </ P> a 
        <-! V Model for data-way binding, only in the use of form elements -> 
        <INPUT type = " text " V-Model = " MSG " /> 
    </ div> 
    <Script> var V = new new Vue ({ 
            EL: ' #divApp ' , 
            Data: { 
                MSG: ' today s date ah !!! ' , 
            }, 
            Methods: { 
            } 
        }) </script>
        
    

When the initial page load, p tags and content text text boxes are msg content, when we modify the text box contents, found that the content of p tags also followed changed that view of the data is updated to the model, this is a two-way binding.

This is often used.

 

Previous

Vue.js study notes five common event modifier