Vue

If you would like to use CKBox in a Vue application, start by installing the ckbox package as described in this guide. Then, create a Vue component in which you attach a reference to a <div /> element and use it to instantiate CKBox in the onMounted lifecycle method.

Show below is the content of an example Vue component file:

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

<script setup lang="ts">
import { onMounted, ref } from "vue";
import * as CKBox from "ckbox";
import "ckbox/dist/styles/ckbox.css";

const ckbox = ref();

onMounted(() => {
    CKBox.mount(ckbox.value, {
        tokenUrl: "https://your.token.url",
    });
});
</script>