radio 增加参数 strict

This commit is contained in:
xuliangzhan
2021-12-04 21:18:54 +08:00
parent c320e299ad
commit f07d17b5cf
5 changed files with 78 additions and 31 deletions

View File

@@ -26,6 +26,16 @@
</vxe-radio-group>
</p>
<p>
<vxe-radio-group v-model="value9" :strict="false">
<vxe-radio label="1" content="HTML"></vxe-radio>
<vxe-radio label="2" content="CSS"></vxe-radio>
<vxe-radio label="3" content="Javascript"></vxe-radio>
<vxe-radio label="4" content="SASS"></vxe-radio>
<vxe-radio label="5" content="LESS"></vxe-radio>
</vxe-radio-group>
</p>
<p>
<vxe-radio-group v-model="value4">
<vxe-radio-button label="1" content="按钮1"></vxe-radio-button>
@@ -37,12 +47,12 @@
<vxe-radio-button label="2" content="按钮2"></vxe-radio-button>
<vxe-radio-button label="3" content="按钮3"></vxe-radio-button>
</vxe-radio-group>
<vxe-radio-group v-model="value6" size="small">
<vxe-radio-group v-model="value6" size="small" :strict="false">
<vxe-radio-button label="1" content="按钮1"></vxe-radio-button>
<vxe-radio-button label="2" content="按钮2"></vxe-radio-button>
<vxe-radio-button label="3" content="按钮3"></vxe-radio-button>
</vxe-radio-group>
<vxe-radio-group v-model="value7" size="mini">
<vxe-radio-group v-model="value7" size="mini" :strict="false">
<vxe-radio-button label="1" content="按钮1"></vxe-radio-button>
<vxe-radio-button label="2" content="按钮2"></vxe-radio-button>
<vxe-radio-button label="3" content="按钮3"></vxe-radio-button>
@@ -81,6 +91,7 @@ export default {
value5: null,
value6: '1',
value7: '1',
value9: '',
demoCodes: [
`
<p>

View File

@@ -9,7 +9,8 @@ export default {
title: [String, Number],
content: [String, Number],
disabled: Boolean,
size: { type: String, default: () => GlobalConfig.radio.size || GlobalConfig.size }
strict: { type: Boolean, default: () => GlobalConfig.radioButton.strict },
size: { type: String, default: () => GlobalConfig.radioButton.size || GlobalConfig.size }
},
inject: {
$xeradiogroup: {
@@ -23,6 +24,10 @@ export default {
isDisabled () {
const { $xeradiogroup } = this
return this.disabled || ($xeradiogroup && $xeradiogroup.disabled)
},
isStrict () {
const { $xeradiogroup } = this
return $xeradiogroup ? $xeradiogroup.strict : this.strict
}
},
render (h) {
@@ -49,7 +54,8 @@ export default {
checked: $xeradiogroup ? $xeradiogroup.value === label : value === label
},
on: {
change: this.changeEvent
change: this.changeEvent,
click: this.clickEvent
}
}),
h('span', {
@@ -58,15 +64,27 @@ export default {
])
},
methods: {
handleValue (label, evnt) {
const { $xeradiogroup } = this
const params = { label, $event: evnt }
if ($xeradiogroup) {
$xeradiogroup.handleChecked(params)
} else {
this.$emit('input', label)
this.$emit('change', params)
}
},
changeEvent (evnt) {
const { $xeradiogroup, isDisabled, label } = this
const { isDisabled } = this
if (!isDisabled) {
const params = { label, $event: evnt }
if ($xeradiogroup) {
$xeradiogroup.handleChecked(params)
} else {
this.$emit('input', label)
this.$emit('change', params)
this.handleValue(this.label, evnt)
}
},
clickEvent (evnt) {
const { $xeradiogroup, isDisabled, isStrict } = this
if (!isDisabled && !isStrict) {
if (this.label === ($xeradiogroup ? $xeradiogroup.value : this.value)) {
this.handleValue(null, evnt)
}
}
}

View File

@@ -6,7 +6,8 @@ export default {
props: {
value: [String, Number, Boolean],
disabled: Boolean,
size: { type: String, default: () => GlobalConfig.radio.size || GlobalConfig.size }
strict: { type: Boolean, default: () => GlobalConfig.radioGroup.strict },
size: { type: String, default: () => GlobalConfig.radioGroup.size || GlobalConfig.size }
},
provide () {
return {

View File

@@ -12,6 +12,7 @@ export default {
content: [String, Number],
disabled: Boolean,
name: String,
strict: { type: Boolean, default: () => GlobalConfig.radio.strict },
size: { type: String, default: () => GlobalConfig.radio.size || GlobalConfig.size }
},
inject: {
@@ -23,6 +24,10 @@ export default {
isDisabled () {
const { $xeradiogroup } = this
return this.disabled || ($xeradiogroup && $xeradiogroup.disabled)
},
isStrict () {
const { $xeradiogroup } = this
return $xeradiogroup ? $xeradiogroup.strict : this.strict
}
},
render (h) {
@@ -49,17 +54,8 @@ export default {
checked: $xeradiogroup ? $xeradiogroup.value === label : value === label
},
on: {
change: evnt => {
if (!isDisabled) {
const params = { label, $event: evnt }
if ($xeradiogroup) {
$xeradiogroup.handleChecked(params)
} else {
this.$emit('input', label)
this.$emit('change', params)
}
}
}
change: this.changeEvent,
click: this.clickEvent
}
}),
h('span', {
@@ -71,15 +67,27 @@ export default {
])
},
methods: {
handleValue (label, evnt) {
const { $xeradiogroup } = this
const params = { label, $event: evnt }
if ($xeradiogroup) {
$xeradiogroup.handleChecked(params)
} else {
this.$emit('input', label)
this.$emit('change', params)
}
},
changeEvent (evnt) {
const { $xeradiogroup, isDisabled, label } = this
const { isDisabled } = this
if (!isDisabled) {
const params = { label, $event: evnt }
if ($xeradiogroup) {
$xeradiogroup.handleChecked(params)
} else {
this.$emit('input', label)
this.$emit('change', params)
this.handleValue(this.label, evnt)
}
},
clickEvent (evnt) {
const { $xeradiogroup, isDisabled, isStrict } = this
if (!isDisabled && !isStrict) {
if (this.label === ($xeradiogroup ? $xeradiogroup.value : this.value)) {
this.handleValue(null, evnt)
}
}
}

View File

@@ -292,7 +292,16 @@ export default {
// transfer: false
},
radio: {
// size: null
// size: null,
strict: true
},
radioButton: {
// size: null,
strict: true
},
radioGroup: {
// size: null,
strict: true
},
checkbox: {
// size: null