Loading

Visão geral

O LxLoading é uma tela de carregamento com uma mensagem opcional. Ele é útil para indicar visualmente que uma ação está sendo processada ou que um conteúdo está sendo carregado.

Clique para exibir o código

<template>
	<LxLoading v-if="isActive" msg="Aguarde, estamos processando sua solicitação..." />

	<button class="btn btn-primary" @click="toogleLoading">Testar (temporizador 3segs)</button>
</template>

<script setup>
import { ref } from 'vue';
import { LxLoading } from '@lde/lxcomponents';

const isActive = ref(false);

const toogleLoading = () => {
	isActive.value = !isActive.value;

	setTimeout(() => {
		isActive.value = !isActive.value;
	}, 3000);
};
</script>

Propriedades

Nome	Descrição	Tipo	Padrão
msg	⚠️ obr Mensagem de carregamento	String	Carregando...