Datumseingabe mit unterer und oberer Grenze.
| Prop | Typ | Standard | Bedeutung |
|---|---|---|---|
modelValue | EditorValue | undefined | undefined | Kontrollierter Wert für v-model. |
value | EditorValue | undefined | undefined | Aktueller Eingabe-/Optionswert. |
label | string | undefined | undefined | Beschriftung beziehungsweise zugänglicher Name. |
name | string | undefined | undefined | Name des Eingabefelds beziehungsweise Dateiname. |
placeholder | string | undefined | undefined | Hinweis bei leerer Eingabe. |
disabled | boolean | undefined | false | Sperrt die Interaktion. |
readOnly | boolean | undefined | false | Verhindert Änderungen des Werts. |
required | boolean | undefined | false | Kennzeichnet die erforderliche Eingabe. |
isValid | boolean | undefined | true | Steuert die Fehlerdarstellung; führt keine eigene Validierung aus. |
validationMessage | string | undefined | Bitte Eingabe prüfen. | Fehlermeldung bei isValid = false. |
min | string | number | undefined | undefined | Untere zulässige Grenze. |
max | string | number | undefined | undefined | Obere zulässige Grenze. |
step | string | number | undefined | 1 | Schrittweite; bei zeitlichen Vue-Bereichen in Millisekunden. |
rows | number | undefined | 3 | Sichtbare Textzeilen. |
dataSource | TxSource<any> | undefined | undefined | Liste, Konfiguration oder DataSource-Instanz; hat Vorrang vor items. |
items | unknown[] | undefined | [] | Einträge; bei Datenbindung durch dataSource ersetzt. |
displayExpr | string | undefined | text | Feld für den sichtbaren Auswahltext. |
valueExpr | string | undefined | value | Feld für den Auswahlwert beziehungsweise Serienwert. |
type | string | undefined | text | Darstellungs-/Eingabetyp; zulässige Werte siehe Signatur. |
Ereignisse
| Event | Payload / Verhalten |
|---|---|
| update:modelValue | Neuer Wert von modelValue; über v-model:modelValue übernehmen (modelValue: v-model). |
| update:value | Neuer Wert von value; über v-model:value übernehmen (modelValue: v-model). |
| valueChanged | Neuer Wert in { value }; Editoren liefern zusätzlich previousValue und event. |
<script setup lang="ts">
import { ref } from 'vue'
import { TxDateBox } from '@tekocloud.de/tecexpress'
import '@tekocloud.de/tecexpress/themes/index.css'
const date = ref('2026-10-28')
</script>
<template>
<TxDateBox v-model="date" label="Date" />
</template>