<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
请输入你的专业 <input type="text"
v-model='age' v-on:input="change" />
{{age}}
</div>
</body>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
<script>
new Vue({
el:"#app",
data:{
name:'小明',
age:'',
amjor:'web'
},
methods:{
方法一:
change:function(){ 不能使用箭头函数
this.text1 = this.age.length
if (this.text1>2){
alert('超出长度')
}
}
方法二(通过event的方式):
change:function(event){ 可以使用箭头函数
if (event.target.value.length>2){
alert('超出长度')
}
console.log(event.target.value)
}
})
</script>
</html>