You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
70 lines
1.6 KiB
70 lines
1.6 KiB
<template>
|
|
<view class="l-radio-group" :class="'l-radio-group--'+ direction">
|
|
<slot />
|
|
</view>
|
|
</template>
|
|
<script lang="ts">
|
|
// @ts-nocheck
|
|
import { defineComponent, provide, ref, computed } from '@/uni_modules/lime-shared/vue'
|
|
import radioGroupProps from './props'
|
|
const name = 'l-radio-group'
|
|
export default defineComponent({
|
|
name,
|
|
props: radioGroupProps,
|
|
emits: ['update:value', 'update:modelValue', 'change', 'input'],
|
|
setup(props, { emit }) {
|
|
const innerValue = ref<any|null>(null);
|
|
const groupValue = computed({
|
|
set(value: any|null) {
|
|
innerValue.value = value;
|
|
emit('update:modelValue', value)
|
|
emit('change', value)
|
|
// #ifdef VUE2
|
|
emit('input', value)
|
|
// #endif
|
|
},
|
|
get():any|null {
|
|
return props.value || props.name || props.modelValue || props.defaultValue || innerValue.value
|
|
}
|
|
} as WritableComputedOptions<any|null>)
|
|
|
|
const handleRadioChange = (val: any) => {
|
|
if (props.allowUncheck && val == groupValue.value) {
|
|
groupValue.value = ''
|
|
} else {
|
|
groupValue.value = val
|
|
}
|
|
}
|
|
provide('limeRadioGroupProps', props)
|
|
provide('limeRadioGroupValue', groupValue)
|
|
provide('limeRadioGroupChange', handleRadioChange)
|
|
|
|
}
|
|
})
|
|
</script>
|
|
<style lang="scss">
|
|
// .l-radio-group {
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// }
|
|
|
|
// .l-radio-group--vertical {
|
|
// flex-direction: column;
|
|
// }
|
|
|
|
.l-radio-group {
|
|
// background-color: antiquewhite;
|
|
}
|
|
|
|
.l-radio-group--vertical {
|
|
:deep(.l-radio) {
|
|
display: flex;
|
|
// line-height: 64rpx;
|
|
}
|
|
|
|
:deep(l-radio) {
|
|
display: flex;
|
|
// line-height: 64rpx;
|
|
}
|
|
}
|
|
</style>
|