Beagle v1.6 não é mais mantida ativamente. A versão documentada que você está visualizando pode conter funcionalidades depreciadas. Para obter as funcionalidades mais recentes, consulte a nossa última versão .
A biblioteca do Beagle fornece um componente auxiliar para renderizar as telas server-driven, o remote view:
Abra o arquivo do componente que você deseja renderizar o layout e adicione o beagle-remote-view, veja o exemplo a seguir
<beagle-remote-view [loadParams]="loadParams"></beagle-remote-view>
Abra o arquivo do componente que você deseja renderizar o layout e adicione o BeagleRemoteView, veja o exemplo a seguir
<BeagleRemoteView {...loadParams} />
Tanto no Angular como no React, o remote view aceita propriedades que são chamadas de Load Params. É por meio dela que algumas opções são configuradas para influenciar a maneira como as telas são renderizadas.
Veja abaixo as propriedades aceitas, apenas path
é obrigatória:
import { LoadParams } from '@zup-it/beagle-web';
const params: LoadParams = {
path: '/payload.json',
fallback: {_beagleComponent_: 'beagle:text', text:'Fallback Error'},
method: 'get',
headers: {'header': 'value'},
shouldShowLoading: true,
shouldShowError: true,
strategy: "network-only",
loadingComponent: 'myComponentLoading',
errorComponent: 'myComponentError'
}
Propriedade | Tipo | Descrição |
---|---|---|
path | string | Obrigatória. Caminho do servidor para carregar o JSON com a tela server-driven. |
fallback | BeagleComponent | Componente para ser renderizado caso a requisição falhe. |
method | método Http | Método Http para fazer a requisição. |
headers | Mapa<chave, valor> | Lista de header para anexar ao fazer a requisição. |
shouldShowLoading | booleano | Mostra ou não o componente de loading. |
shouldShowError | booleano | Mostra ou não o componente de erro. |
strategy | string<Estratégia de cache> | Estratégia de cache adotada na requisição. |
loadingComponent | string | Componente customizado para loading. |
errorComponent | string | Componente customizado para error. |
Was this page helpful?
Glad to hear it! Please tell us how we can improve.
Sorry to hear that. Please tell us how we can improve.