Vue获取表单数据的方法

目录

• 需求
• 获取数据并提交
• 模板过滤器
• 过滤器的使用场景
• 总结

需求

使用Vue收集如下用户数据：

获取数据并提交

代码实现：

将value的值与变量属性进行绑定

v-model.trim = ‘username' ; 去除两端空格

v-model.number = ‘age'；将字符串转为数值

v-model.lazy = ‘age' ； 不是立即收集，而是切换焦点后收集

    
    
    
    
    


    

        

            用户名:

            

            密码:

            

            年龄:

            
            
            

            性别:
            
            女
            男
            

            
            爱好:
            乒乓球
            篮球
            足球
            

            
            选择城市:

            
                选择城市
                郑州
                武汉
                北京
            
            

            
            描述:

            
            

            
            阅读并接受《用户协议》
            
            提交
            
            
        
    

    

模板过滤器

    
    
    
    
    
    


    

        
        {{ time | timeFormatter}}

        
        {{ time | timeFormatter("YY-MM-DD hh:mm:ss")}}	
        
    
    

过滤器的使用场景

1.插值语法中使用

2.v-bind：属性 =‘ xx| xx '

处理一些简单的操作，产生了新数据

总结

本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注脚本之家的更多内容!