<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>单选框</title>
<script src="https://cdn.jsdelivr.net/vue/1.0.26/vue.min.js"></script>
</head>
<body>
<div id="app">
<input type="radio" name="radios" value="1" v-model="param"><label>one</label>
<br>
<input type="radio" name="radios" value="2" v-model="param"><label>two</label>
<br>
<input type="radio" name="radios" value="3" v-model="param"><label>three</label>
</div>
</body>
<script>
new Vue({
el: '#app',
data(){
return{
param:'3' //设置默认值为1，即设置第一个单选框为选中状态
}
}
})
</script>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>复选框</title>
<script src="https://cdn.jsdelivr.net/vue/1.0.26/vue.min.js"></script>
</head>
<body>
<div id="app">
<select v-model="selected">
<option v-for="opt in options" v-bind:value="opt.value">{{opt.text}}</option>
</select>
<br>
<span>Selected: {{ selected }}</span>
</div>
</body>
<script>
var options = [
{ text: 'A-label', value: 'A' },
{ text: 'B-label', value: 'B' },
{ text: 'C-label', value: 'C' }
];
new Vue({
el: '#app',
data: {
selected: 'C',
options: []
},
created: function(){
this.options = options;
}
})
</script>
</html>
