Packages

@lia-labs/sdk-vue

Kopya ang pahina

Vue 3 composables para sa Lia SDK. Lia's state bilang read-only refs, at mga button na pinamumuhunan ng refs o getters.

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

Vue 3.3 o mas mataas. Lahat mula sa @lia-labs/sdk ay re-exported. Ang bawat composable ay tumigil sa pagmamay-ari kapag ang kanyang component (o effect scope) ay nawala.

#Isang app

<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	Nagbibigay sa iyo
`useInit(options?)`	`{ status, result, error }` bilang mga tawag. Mga tawag `init()` isang beses.
`useSignal(value)`	Anumang SDK value bilang isang read-only ref.
`usePlayer()`, `useMode()`, `useLanguage()`, `useRtl()`, `useColorScheme()`, `useThemeParams()`, `useViewport()`, `useSafeArea()`, `useContentSafeArea()`, `useIsFullscreen()`, `useStartParam()`, `useSoundOn()`, `useNotificationsAllowed()`	Lia'ang state bilang read-only refs.
`useLiaEvent(event, handler)`	Nag-uusap para sa isang sa Lia'ang mga event.
`useBannerAd(position?)`, `useBanner()`, `useNativeAd()`	Nakadock ang isang banner Lia na nakasunod sa iyong pahina (na mas maikli upang magkasya ito): `"bottom"`, `"top"`, o isang accessor (`null` itinago ito); at ang banner at native ad ngayon.
`useMainButton(options)`, `useSecondaryButton(options)`	Nagpapakita ng button. `options` maka maging isang object, isang ref o isang getter, at ang button ay sumusunod dito; `null` o `false` itinago ito.
`useBackButton(onBack)`, `useSettingsButton(onOpen)`	Nagpapakita ng header button. Ipadala ang isang function, o isang ref sa isang function (`null` itinago ito).
`useClosingConfirmation(enabled?)`, `useVerticalSwipesDisabled(disabled?)`	`enabled` maka maging isang boolean, isang ref o isang getter.

Awtomatikong isinalin. Ang English ay ang source of truth. Basahin sa Ingles