v-model 有修饰符
使用修饰符 .lazy 会转变为在 change 事件中同步
.number 可以将输入转换为 Number 类型
修饰符 .trim 可以自动过滤输入的首尾空格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
姓名: <input type="text" v-model.lazy="name">
<p>姓名{{ typeof name}}---{{name}}</p>
密码:<input type="text" v-model.number="password">
<p>返回的类型{{ typeof password}}---{{password}}</p>
年龄:<input type="text" v-model.trim="age">
<p>年龄{{age}}</p>
</div>
<script>
var v=new Vue({
el:"#app",
data:{
name:'',
password:12,
age:''
}
});
</script>
</body>
</html>