Paquets

@lia-labs/sdk-vue

Copier la page

Composables Vue 3 pour Lia SDK. Lia's état en refs en lecture seule, et les boutons pilotés par des refs ou des getters.

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

Vue 3.3 ou plus. Tout à partir de @lia-labs/sdk est réexporté. Chaque composant arrête d'écouter lorsqu'il quitte sa composante (ou son portée d'effet).

#Une application

<script setup lang="ts">
import { computed, ref, watch } from 'vue';
import { isLia, mockLia, pay, ready, useBackButton, useClosingConfirmation, useInit, useLanguage, useMainButton } from '@lia-labs/sdk-vue';

if (!isLia()) mockLia();

const lia = useInit();
const language = useLanguage();
const playing = ref(false);

watch(lia.status, (status) => status === 'ready' && ready());
useMainButton(() => !playing.value && { text: 'Buy extra lives', onClick: () => pay('extra-lives') });
useBackButton(computed(() => (playing.value ? () => (playing.value = false) : null)));
useClosingConfirmation(playing);
</script>

<template>
  <h1 v-if="lia.status.value === 'ready'">Hello, @{{ lia.result.value?.player.name }} ({{ language }})</h1>
</template>

#Composables

Composable	Vous donne
`useInit(options?)`	`{ status, result, error }` en tant que références. Appels `init()` une fois.
`useSignal(value)`	N'importe quelle valeur SDK en tant que ref en lecture seule.
`usePlayer()`, `useMode()`, `useLanguage()`, `useRtl()`, `useColorScheme()`, `useThemeParams()`, `useViewport()`, `useSafeArea()`, `useContentSafeArea()`, `useIsFullscreen()`, `useStartParam()`, `useSoundOn()`, `useNotificationsAllowed()`	Lia'son état en références en lecture seule.
`useLiaEvent(event, handler)`	Écoute l'une des Lia'les événements.
`useBannerAd(position?)`, `useBanner()`, `useNativeAd()`	Ancre un bandeau Lia à côté de votre page (qui devient plus court pour s'y adapter) : `"bottom"`, `"top"`, ou un ref ou un getter (`null` le cache) ; et le bannière et l'annonce native maintenant.
`useMainButton(options)`, `useSecondaryButton(options)`	Affiche le bouton. `options` peut être un objet, une référence ou un getter, et le bouton le suit; `null` ou `false` le cache.
`useBackButton(onBack)`, `useSettingsButton(onOpen)`	Affiche le bouton de l'en-tête. Passez une fonction, ou une référence à une (`null` le cache).
`useClosingConfirmation(enabled?)`, `useVerticalSwipesDisabled(disabled?)`	`enabled` peut être un booléen, une référence ou un getter.

Traduit automatiquement. L'anglais est la source de vérité. Lire en anglais