一饭聚、單選框的數(shù)據(jù)雙向綁定
<template>
<div>
<p>
<label>
<input type="radio" name="st" value="c" v-model="styles">顏色
</label>
<label>
<input type="radio" name="st" value="b" v-model="styles">品牌
</label>
</p>
</div>
</template>
<script>
export default {
data() {
return {
styles: 'c'
}
},
}
</script>
<style lang="scss" scoped>
</style>
二忌警、復(fù)選框的雙向數(shù)據(jù)綁定
<template>
<div>
<p>
<label>
<input type="radio" name="st" value="c" v-model="styles">顏色
</label>
<label>
<input type="radio" name="st" value="b" v-model="styles">品牌
</label>
</p>
<div v-show="styles === 'c'">
<p>
紅色
</p>
<p>
白色
</p>
</div>
<div v-show="styles === 'b'">
<p>
豐田
</p>
<p>
大眾
</p>
</div>
<div>
<label>
<input type="checkbox" v-model="read">我已閱讀協(xié)議
</label>
<button :disabled="!read">提交</button>
</div>
</div>
</template>
<script>
export default {
data() {
return {
styles: 'c',
read: false,
}
},
}
</script>
<style>
</style>
