TxToast · Vue · tecexpress

Zeitlich begrenzte Statusmeldung; Sichtbarkeitsänderungen in der Anwendung übernehmen.

Prop	Typ	Standard	Bedeutung
`visible`	`boolean \| undefined`	`false`	Steuert die Sichtbarkeit.
`message`	`string \| undefined`	`undefined`	Meldungstext.
`position`	`string \| undefined`	`bottom-right`	Position der Meldung beziehungsweise des Overlays.
`type`	`"error" \| "success" \| "info" \| "warning" \| undefined`	`info`	Darstellungs-/Eingabetyp; zulässige Werte siehe Signatur.
`displayTime`	`number \| undefined`	`3500`	Anzeigedauer; 0 beziehungsweise Duration.zero bleibt offen.

Ereignisse

Event	Payload / Verhalten
update:visible	Neuer Wert von visible; über v-model:visible übernehmen (modelValue: v-model).

Slots

Slot	Argumente
default	()
actions	()

vue

<script setup lang="ts">
import { ref } from 'vue'
import { TxToast, TxButton } from '@tekocloud.de/tecexpress'
import '@tekocloud.de/tecexpress/themes/index.css'
const visible = ref(false)
</script>

<template>
  <TxButton text="Notify" @click="visible = true" />
  <TxToast v-model:visible="visible" message="Saved" type="success" />
</template>

TxToast.