簡單的實現了vue2.0移動端自定義性別選擇的功能，一個小的demo
-
<template>
-
<div class="app">
-
-
<div class="boy">
-
<input type="radio" name="radios" value="1" v-model="param">
<label>男
</label>
-
</div>
-
-
<div class="girl">
-
<input type="radio" name="radios" value="2" v-model="param">
<label>女
</label>
-
</div>
-
-
</div>
-
</template>
-
<script>
-
export
default {
-
data() {
-
return {
-
param:
'1'
//設置默認值為1，即設置第一個單選框為選中狀態
-
-
}
-
},
-
methods: {
-
-
}
-
};
-
</script>
-
-
<style>
-
.app{
-
height:
60px;
-
background:
#fff;
-
border:
1px solid
#f1ebeb;
-
}
-
.boy{
-
height:
30px;
-
background: fff;
-
border-bottom:
1px solid
#f1ebeb;
-
}
-
.boy
input{
-
text-align: center;
-
}
-
.boy
label{
-
text-align: center;
-
}
-
-
-
.girl{
-
height:
30px;
-
background: fff;
-
}
-
</style>