form组件内嵌space组件，space和其中的内容不渲染 about varlet HOT 6 CLOSED

<var-input
                        v-model="model.username"
                        :placeholder="$t('page.login.common.userNamePlaceholder')"
                        :rules="new Rules().required().value"
                        size="small"
                        variant="outlined"
                    >
                        <template #prepend-icon>
                            <var-icon name="account-circle"/>
                        </template>
                    </var-input>

export class Rules {
    rules = []

    get value() {
        return this.rules;
    }

    required(errorMessage = '不能为空') {
        this.rules.push((v) => {
            if (v === null || v === undefined) return errorMessage;
            if (typeof v === 'string' && v.trim() === '') return errorMessage;
            if (Array.isArray(v) && v.length === 0) return errorMessage;
            if (typeof v === 'object' && !Array.isArray(v) && Object.keys(v).length === 0) return errorMessage;
            return true;
        });
        return this;
    }
}

class formRules{
    rules = []

    get value() {
        return this.rules;
    }

    required(errorMessage = '不能为空') {
        this.rules.push((v) => {
            if (v === null || v === undefined) return errorMessage;
            if (typeof v === 'string' && v.trim() === '') return errorMessage;
            if (Array.isArray(v) && v.length === 0) return errorMessage;
            if (typeof v === 'object' && !Array.isArray(v) && Object.keys(v).length === 0) return errorMessage;
            return true;
        });
        return this;
    }
}

export const Rules = new formRules();

<var-form ref="formRef">
        <var-space
            direction="column"
            size="5vmin"
        >
            <var-input
                v-model="model.username"
                :placeholder="$t('page.login.common.userNamePlaceholder')"
                :rules="Rules.required().value"
                size="small"
                variant="outlined"
                @keydown.enter="handleSubmit"
            >
                <template #prepend-icon>
                    <var-icon name="account-circle"/>
                </template>
            </var-input>
<var-input
                v-model="model.password"
                :placeholder="$t('page.login.common.passwordPlaceholder')"
                :rules="Rules.required().value"
                size="small"
                type="password"
                variant="outlined"
                @keydown.enter="handleSubmit"
            >
                <template #prepend-icon>
                    <var-icon name="lock"/>
                </template>
            </var-input>
</var-space>
</var-form>