# j-Part

> Este componente pode lidar com diferentes conteúdos de forma asíncrona.Se o elemento não contém nenhum conteúdo, então o componente descarrega o conteúdo de acordo com a URL definida na configuração.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: pt
Content-SHA256: 776864db25c4463ab250a718ca32298d4ba963a5a2331b22a27fe52e64ba139a
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Este componente pode lidar com diferentes conteúdos de forma asíncrona. __Se o elemento não contém nenhum conteúdo__ então o componente descarrega o conteúdo de acordo com o `url` definido na configuração.

- __NEW__ `path` pode conter `{String Array}`

__Configuração__:

- `url {String}` requerido, um endereço URL relativo
- `if {String}` exigido, condição, é comparado com o valor dentro de `path` (__NEW__: suporta vários caminhos divididos pelo `comma`)
- `reload {String}` opcional, um link para a função `function(init) {}`, é executado quando a parte é visível (todas as vezes)
- `hidden {String}` opcional, um link para a função, é executado quando a parte está escondida (todas as vezes)
- `init {String}` opcional, um link para a função, é executado quando a parte é visível e on-time
- `default {String}` opcional, um alias curto para `DEFAULT(default)`
- `hide {Boolean}` opcional, elemento auto-escondido se a condição `if` não for válida (default: `true`)
- `cleaner {Number}` opcional, tempo idle (em minutos) para o funcionamento da limpeza (default: `0`)
- `clean {String}` opcional, um link para a função, é executado antes da parte é limpa
- `loading {Boolean}` opcional, permite o carregamento através de `SETTER('loading')` (default: `true`)
- `path {String}` opcional, o componente substitui todas as frases `~PATH~` e `CLASS` para o valor do `path` no modelo baixado
- `replace {String}` opcional, um link para o método `function(content) { return content }` que pode modificar o modelo baixado
- `absolute {Boolean}` opcional, permite posição absoluta (default `false`)
- `check {String}` opcional, um link para a função `function(next) { next(); }`, é executado quando a parte quer mostrar
- `invisible {Boolean}` permite a adição de classe `invisible` quando a parte vai se esconder (default: `false`)
- `delay {Number}` um atraso (em ms) para a remoção da classe `invisible` e ocultar `loading` (default: `500`)
- `autofocus {Boolean/String}` concentra a primeira entrada, textarea (default: `false`)
- `delayloading {Number}` um atraso (em ms) para esconder `loading` (default: `800`)
- `id {String}` um identificador personalizado para substituir frases `~ID~` no HTML importado (default: vazio)

__É bom saber 1__:

- Todas as frases `CLASS` e `~PATH~` serão substituídas por `config.path` ou `config.if` automaticamente
- Todas as frases `~ID~` serão substituídas por `config.id` automaticamente

__É bom saber 2__:

Parte componente emite um `event` na forma: `parts.` + `config.if` para a extensão de partes.

__É bom saber 3__:

Se o componente não estiver dentro do âmbito, então o valor do `config.if` substituirá os caracteres `?` em todas as chaves de configuração.

```js
ON('parts.YOURIFCONDITION', function(element, pagecomponent) {
	// It's executed only when the part is initialized
});
```

Use-o com `<ui-component name="part">`Quando o componente ainda não está carregado, jComponent Descarrega-o no primeiro uso do endereço `DEF.fallback` (a partir do Componentator CDN por padrão). autor: Peter Širka. fonte: o Componentator Reserva de componentes, licença MIT.

```html example.html
<ui-component name="part" path="currentpart" config="if:home;url:/bla/bla/home.html"></ui-component>
<ui-component name="part" path="currentpart" config="if:services;url:/bla/bla/services.html;reload:services_reload"></ui-component>
<ui-component name="part" path="currentpart" config="if:contact;url:/bla/bla/contact.html;reload:contact_reload"></ui-component>

<pre><code>SET(&#39;currentpart&#39;, &#39;home&#39;);</code></pre>

<script>
	var currentpart = '';
</script>
```