Advanced Usage

Each instance of the Cookiebot composable can be configured and thus using app configuration / stateful logic to enhance your Cookiebot implementation.
For example, you can use vue-i18n to localize the content of your Cookiebot features.

For a full list of options, consult the api reference.

Vue-i18n example

src/App.vue

<script setup lang="ts">
    // Vendor
    import { useCookiebot } from '@ambitiondev/vue-cookiebot';
    import { onMounted, ref } from 'vue';
    import { useI18n } from 'vue-i18n';

    // Refs
    const cookieDeclarationRef = ref<HTMLDivElement | null>(null);

    // Composable
    const { locale } = useI18n();
    const { cookieDeclaration } = useCookiebot({
        culture: locale.value,
    });

    onMounted(() => {
        cookieDeclaration(cookieDeclarationRef);
    });
</script>

<template>
    <div ref="cookieDeclarationRef"></div>
</template>

VueUsage

NuxtInstallation