Create useToast composable
This commit is contained in:
@@ -0,0 +1,32 @@
|
|||||||
|
type Toast = {
|
||||||
|
id: number;
|
||||||
|
message: string;
|
||||||
|
description?: string;
|
||||||
|
duration?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
message: string,
|
||||||
|
description?: string,
|
||||||
|
options?: Omit<Toast, "id" | "message">
|
||||||
|
}
|
||||||
|
|
||||||
|
const toasts = ref<Toast[]>([]);
|
||||||
|
|
||||||
|
export function useToast() {
|
||||||
|
const addToast = ({ message, description, options = {} }: Props) => {
|
||||||
|
const id = Date.now();
|
||||||
|
|
||||||
|
toasts.value.push({ id, message, description, ...options });
|
||||||
|
};
|
||||||
|
|
||||||
|
const destroyToast = (id: number) => {
|
||||||
|
toasts.value = toasts.value.filter(toast => toast.id !== id);
|
||||||
|
};
|
||||||
|
|
||||||
|
return {
|
||||||
|
toasts,
|
||||||
|
addToast,
|
||||||
|
destroyToast
|
||||||
|
};
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user