types: improve Checker parent typing (#8128)

This commit is contained in:
neverland 2021-02-10 22:53:55 +08:00 committed by GitHub
parent afad4ca90a
commit b5944524d9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 5 deletions

View File

@ -5,6 +5,15 @@ import Icon from '../icon';
export type CheckerShape = 'square' | 'round'; export type CheckerShape = 'square' | 'round';
export type CheckerLabelPosition = 'left' | 'right'; export type CheckerLabelPosition = 'left' | 'right';
type CheckerParent = {
props: {
disabled?: boolean;
iconSize?: number | string;
direction?: 'horizontal' | 'vertical';
checkedColor?: string;
};
};
export const checkerProps = { export const checkerProps = {
name: null as any, name: null as any,
disabled: Boolean, disabled: Boolean,
@ -23,7 +32,7 @@ export default defineComponent({
props: { props: {
...checkerProps, ...checkerProps,
role: String, role: String,
parent: Object as PropType<Record<string, any> | null>, parent: Object as PropType<CheckerParent | null>,
checked: Boolean, checked: Boolean,
bindGroup: { bindGroup: {
type: Boolean, type: Boolean,
@ -40,13 +49,13 @@ export default defineComponent({
setup(props, { emit, slots }) { setup(props, { emit, slots }) {
const iconRef = ref<HTMLElement>(); const iconRef = ref<HTMLElement>();
const getParentProp = (name: string) => { const getParentProp = <T extends keyof CheckerParent['props']>(name: T) => {
if (props.parent && props.bindGroup) { if (props.parent && props.bindGroup) {
return props.parent.props[name]; return props.parent.props[name];
} }
}; };
const disabled = computed<boolean>( const disabled = computed(
() => getParentProp('disabled') || props.disabled () => getParentProp('disabled') || props.disabled
); );

View File

@ -176,7 +176,7 @@ test('should toggle collapse after calling the toggle method in accordion mode',
setup() { setup() {
const itemA = ref(); const itemA = ref();
const itemB = ref(); const itemB = ref();
const active = ref([]); const active = ref('');
return { return {
itemA, itemA,
itemB, itemB,
@ -194,6 +194,7 @@ test('should toggle collapse after calling the toggle method in accordion mode',
}); });
wrapper.vm.itemA.toggle(); wrapper.vm.itemA.toggle();
await later();
expect(wrapper.vm.active).toEqual('a'); expect(wrapper.vm.active).toEqual('a');
wrapper.vm.itemB.toggle(); wrapper.vm.itemB.toggle();

View File

@ -100,7 +100,6 @@ export default createComponent({
<p class={bem('valid')}>{validPeriod.value}</p> <p class={bem('valid')}>{validPeriod.value}</p>
{!disabled && ( {!disabled && (
<Checkbox <Checkbox
size={18}
class={bem('corner')} class={bem('corner')}
modelValue={chosen} modelValue={chosen}
checkedColor={RED} checkedColor={RED}