From b6580b050e7aaea273d6b41f0cda0fc3077afae2 Mon Sep 17 00:00:00 2001 From: Pablo Bion Date: Sun, 10 Oct 2021 20:21:37 -0300 Subject: Alterações solicitadas para tradução de custom element registry (#2533) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Adicionando tradução para os topicos get, upgrade, define e whendefined de customelementregistry * Pequenos ajustes para novas paginas traduzidas --- .../customelementregistry/whendefined/index.html | 106 +++++++++++++++++++++ 1 file changed, 106 insertions(+) create mode 100644 files/pt-br/web/api/customelementregistry/whendefined/index.html (limited to 'files/pt-br/web/api/customelementregistry/whendefined') diff --git a/files/pt-br/web/api/customelementregistry/whendefined/index.html b/files/pt-br/web/api/customelementregistry/whendefined/index.html new file mode 100644 index 0000000000..6480557933 --- /dev/null +++ b/files/pt-br/web/api/customelementregistry/whendefined/index.html @@ -0,0 +1,106 @@ +--- +title: CustomElementRegistry.whenDefined() +slug: Web/API/CustomElementRegistry/whenDefined +tags: + - API + - CustomElementRegistry + - Method + - Reference + - Web Components + - custom elements + - whenDefined +browser-compat: api.CustomElementRegistry.whenDefined +--- + +

{{APIRef("CustomElementRegistry")}}

+ +

+ O whenDefined() é um método de {{domxref("CustomElementRegistry")}} e a interface retorna uma {{jsxref("Promise")}} que é resolvido quando o elemento nomeado é + definido. +

+ +

Syntax

+ +
customElements.whenDefined(name): Promise<CustomElementConstructor>;
+ +

Parâmetros

+ +
+
name
+
Nome do elemento personalizado.
+
+ +

Valor de retorno

+ +

+ A {{jsxref("Promise")}} que será cumprida com o elemento personalizado's construtor quando um + custom element torna-se definido com o nome fornecido. (Se o custom element já foi + definido, a promessa devolvida será imediatamente cumprida.) +

+ +

Exceções

+ + + + + + + + + + + + + + +
ExceçãoDescrição
SyntaxError + Se o nome fornecido não for um nome de elemento personalizado válido, a promessa + rejeita com um SyntaxError. +
+ +

Exemplos

+ +

+ Este exemplo usa whenDefined() para detectar quando os elementos personalizados que compõem um menu são definidos. O menu exibe o conteúdo do espaço reservado até que o conteúdo do + menu real esteja pronto para ser exibido. +

+ +
+<nav id="menu-container">
+  <div class="menu-placeholder">Loading...</div>
+  <nav-menu>
+    <menu-item>Item 1</menu-item>
+    <menu-item>Item 2</menu-item>
+     ...
+    <menu-item>Item N</menu-item>
+  </nav-menu>
+</nav>
+
+ +
+const container = document.getElementById('menu-container');
+const placeholder = container.querySelector('.menu-placeholder');
+// Busca todos os filhos do menu que ainda não foram definidos.
+const undefinedElements = container.querySelectorAll(':not(:defined)');
+
+async function removePlaceholder(){
+  const promises = [...undefinedElements].map(
+    button => customElements.whenDefined(button.localName)
+  );
+
+  // Espere que todos os filhos sejam atualizados
+  await Promise.all(promises);
+  // em seguida, remova o espaço reservado
+  container.removeChild(placeholder);
+}
+
+removePlaceholder();
+
+ +

Specifications

+ +{{Specifications}} + +

Compatibilidade com navegadores

+ +

{{Compat}}

-- cgit v1.2.3-54-g00ecf