<!DOCTYPE html>
<html>
<head>
<script src="js/vue.js"></script>
</head>
<body id="example">
<form>
姓名：
<input type="text" v-model="data.name">
<br>
性别：
<input type="radio" name="sex" v-model="data.sex" id="man" value="one">
<label for="man">男</label>
<input type="radio" name="sex" v-model="data.sex" id="woman" value="two">
<label for="woman">女</label>
<br>
年龄：
<input type="text" name="age" v-model="data.age" number>
<label for="age"></label>
<br>
兴趣：
<input type="checkbox" id="book" value="book" v-model="data.interest">
<label for="book">阅读</label>
<input type="checkbox" id="swim" value="swim" v-model="data.interest">
<label for="swim">游泳</label>
<input type="checkbox" id="game" value="game" v-model="data.interest">
<label for="game">游戏</label>
<br>
身份：
<select v-model="data.identity">
<option value="teacher">教师</option>
<option value="docter">医生</option>
<option value="lawyer">律师</option>
</select>
</form>
</body>
<script>
var vue = new Vue({
el: '#example',
data: {
name: '',
sex: '',
age: '',
interest: [],
identity: ''
}
});
</script>
</html>
<html>
<head>
<script src="js/vue.js"></script>
</head>
<body id="example">
<form>
姓名：
<input type="text" v-model="data.name">
<br>
性别：
<input type="radio" name="sex" v-model="data.sex" id="man" value="one">
<label for="man">男</label>
<input type="radio" name="sex" v-model="data.sex" id="woman" value="two">
<label for="woman">女</label>
<br>
年龄：
<input type="text" name="age" v-model="data.age" number>
<label for="age"></label>
<br>
兴趣：
<input type="checkbox" id="book" value="book" v-model="data.interest">
<label for="book">阅读</label>
<input type="checkbox" id="swim" value="swim" v-model="data.interest">
<label for="swim">游泳</label>
<input type="checkbox" id="game" value="game" v-model="data.interest">
<label for="game">游戏</label>
<br>
身份：
<select v-model="data.identity">
<option value="teacher">教师</option>
<option value="docter">医生</option>
<option value="lawyer">律师</option>
</select>
</form>
</body>
<script>
var vue = new Vue({
el: '#example',
data: {
name: '',
sex: '',
age: '',
interest: [],
identity: ''
}
});
</script>
</html>