省份，城市，县区这三个input写的东西自动相加到家庭地址这个input里面怎么做
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="vue.js"></script>
<style>
.border_style{width: 400px;border:1px solid blue;}
</style>
</head>
<body>
<div id="app">
<div class="border_style">
姓名:<input type="text" v-model="user.username"></br></br>
省份:<input type="text" v-model="user.province" @keyup="getAddress"></br></br>
城市:<input type="text" v-model="user.city" @keyup="getAddress"></br></br>
县,区或街道:<input type="text" v-model="user.street" @keyup="getAddress"></br></br>
家庭地址:<input type="text" size="50" username="" id="" v-model="user.address" redonly @keyup="getAddress"/></br></br>
</div></br>
<input type="submit" value="注册" @click.prevent="register">
<button @click="res">重填</button>
<p v-for="user in userList" v-bind:key="user.username"><input type="checkbox">{{user.username}} {{user.province}} {{user.city}} {{user.street}} {{user.address}}</p>
</div>
<script>
var vm = new Vue({
el: "#app",
data: {
user: {
username: '',
province: '',
city: '',
street: '',
address: ''
},
userList: [],
},
methods: {
register () {
console.log(this.user);
var user = JSON.parse(JSON.stringify(this.user));
this.userList.push(user);
},
getAddress(){
},
res () {
this.user.username = ''
this.user.province = ''
this.user.city = ''
this.user.street = ''
this.user.address = ''
},
}
})
</script>
</body>
</html>
this.user.address = this.user.province + this.user.city + this.user.street
用vue的话可以watch监听