feat(CheckboxGroup): add direction prop
This commit is contained in:
@@ -1,12 +1,19 @@
|
||||
<template>
|
||||
<demo-block :title="$t('fieldType')">
|
||||
<van-form @submit="onSubmit">
|
||||
<van-field name="switch" :label="$t('switch')">
|
||||
<van-switch v-model="switchChecked" slot="input" size="24" />
|
||||
</van-field>
|
||||
|
||||
<van-field name="checkbox" :label="$t('checkbox')">
|
||||
<van-checkbox v-model="checkbox" slot="input" shape="square" />
|
||||
</van-field>
|
||||
|
||||
<van-field name="switch" :label="$t('switch')">
|
||||
<van-switch v-model="switchChecked" slot="input" size="24" />
|
||||
<van-field name="radio" :label="$t('radio')">
|
||||
<van-radio-group v-model="radio" direction="horizontal" slot="input">
|
||||
<van-radio name="1" class="demo-radio">{{ $t('radio') }} 1</van-radio>
|
||||
<van-radio name="2">{{ $t('radio') }} 2</van-radio>
|
||||
</van-radio-group>
|
||||
</van-field>
|
||||
|
||||
<van-field name="rate" :label="$t('rate')">
|
||||
@@ -33,6 +40,7 @@ export default {
|
||||
i18n: {
|
||||
'zh-CN': {
|
||||
rate: '评分',
|
||||
radio: '单选框',
|
||||
submit: '提交',
|
||||
switch: '开关',
|
||||
slider: '滑块',
|
||||
@@ -43,6 +51,7 @@ export default {
|
||||
},
|
||||
'en-US': {
|
||||
rate: 'Rate',
|
||||
radio: 'Radio',
|
||||
submit: 'Submit',
|
||||
switch: 'Switch',
|
||||
slider: 'Slider',
|
||||
@@ -56,6 +65,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
rate: 3,
|
||||
radio: '1',
|
||||
slider: 50,
|
||||
stepper: 1,
|
||||
checkbox: false,
|
||||
|
||||
@@ -21,6 +21,18 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div>
|
||||
<form class="van-form">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>开关</span></div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<div class="van-field__control van-field__control--custom">
|
||||
<div role="switch" aria-checked="false" class="van-switch" style="font-size: 24px;">
|
||||
<div class="van-switch__node"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>复选框</span></div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
@@ -35,12 +47,19 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>开关</span></div>
|
||||
<div class="van-cell__title van-field__label"><span>单选框</span></div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<div class="van-field__control van-field__control--custom">
|
||||
<div role="switch" aria-checked="false" class="van-switch" style="font-size: 24px;">
|
||||
<div class="van-switch__node"></div>
|
||||
<div role="radiogroup" class="van-radio-group van-radio-group--horizontal">
|
||||
<div role="radio" tabindex="0" aria-checked="true" class="demo-radio van-radio van-radio--horizontal">
|
||||
<div class="van-radio__icon van-radio__icon--round van-radio__icon--checked"><i class="van-icon van-icon-success">
|
||||
<!----></i></div><span class="van-radio__label">单选框 1</span>
|
||||
</div>
|
||||
<div role="radio" tabindex="-1" aria-checked="false" class="van-radio van-radio--horizontal">
|
||||
<div class="van-radio__icon van-radio__icon--round"><i class="van-icon van-icon-success">
|
||||
<!----></i></div><span class="van-radio__label">单选框 2</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user