vue实现的双向数据绑定操作示例

本文实例讲述了vue实现的双向数据绑定操作。分享给大家供大家参考，具体如下：

 
 
 
  
 
 
 
  修改msg


    
{{msg}}
    
    
{{"用户修改的数据："+userAddress}}
    

    v-model.number
    
    

    
    

    求和
    {{num}}
    

    v-model.trim
    没有过滤首尾空格时：
    
    {{myInput.length}}
    过滤首尾空格时：
    
    {{myInput.length}}
    v-moddel.lazy
    input失去焦点时才会输出myMsg
    
    {{myMsg}}
  
  
 

使用在线HTML/CSS/Javascript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试，可得到如下运行效果

感兴趣的朋友可以测试一下看看运行效果。

希望本文所述对大家vue.js程序设计有所帮助。