Paquetes

@lia-labs/sdk-svelte

Copiar página

Almacenes de Svelte para el Lia SDK, para Svelte 4 y 5. Lia's estado como almacenes, y botones para la vida de un componente.

npm install @lia-labs/sdk @lia-labs/sdk-svelte

Svelte 4 o 5. Todo desde @lia-labs/sdk se reexporta.

#Una app

<script lang="ts">
  import { initStore, isLia, mockLia, pay, ready, stores, useMainButton } from '@lia-labs/sdk-svelte';

  if (!isLia()) mockLia();

  const lia = initStore();
  const { language, colorScheme } = stores;
  $: if ($lia.status === 'ready') ready();

  useMainButton({ text: 'Buy extra lives', onClick: () => pay('extra-lives') });
</script>

{#if $lia.status === 'ready'}
  <h1>Hello, @{$lia.result.player.name} ({$language}, {$colorScheme})</h1>
{/if}

#Almacenamiento y ayudantes

Exportar	Te da
`initStore(options?)`	Un almacén de `{ status, result, error }` que llama `init()`.
`stores`	Lia's estado como almacenes: `player`, `mode`, `language`, `rtl`, `colorScheme`, `themeParams`, `viewport`, `safeArea`, `contentSafeArea`, `isFullscreen`, `startParam`, `soundOn`, `notificationsAllowed`, `initialized`, `banner`, `nativeAd`.
`toStore(value)`	Cualquier valor SDK como almacén.
`useLiaEvent(event, handler)`	Escucha uno de Lia'los eventos para el componente'tu vida; devuelve una función de parada.
`useBannerAd(position?)`	Ancla una banda publicitaria Lia a un lado de tu página (que se acorta para ajustarse a ella): `"bottom"`, `"top"`, para el componente'tu vida; devuelve una función que la oculta temprano. `stores.banner` y `stores.nativeAd` síguelos.
`useMainButton(options)`, `useSecondaryButton(options)`	Muestra el botón para el componente'tu vida. Devoluciones `{ update(options), dispose() }`.
`useBackButton(onBack)`, `useSettingsButton(onOpen)`	Muestra el botón del encabezado para el componente'tu vida. Devoluciones `{ update, dispose }`.
`useClosingConfirmation()`, `useVerticalSwipesDisabled()`	Para el componente'tu vida; devuelve una función que la termina temprano.

Llame al use* ayudantes mientras un componente se está configurando, por lo que terminan con él. Se llaman en cualquier otro lugar (un manejador de eventos, un módulo), funcionan de la misma forma pero tú los llamas dispose() tú mismo:

let back: { dispose(): void } | null = null;
function openDetail() {
  back = useBackButton(closeDetail);
}
function closeDetail() {
  back?.dispose();
}

Traducido automáticamente. El inglés es la fuente de verdad. Leer en inglés