Examples

React

import PageViews from '@yeger/page-views'
import type { FC } from 'react'
import { useEffect, useState } from 'react'

const ViewCounter: FC = () => {
  PageViews.autoSubmitViews()

  const [pageViews, setPageViews] = useState<number>()

  useEffect(() => {
    PageViews.getViews().then(setPageViews)
  })

  if (pageViews === undefined) {
    return <span>Loading...</span>
  }

  return <span>{pageViews} views</span>
}

Vue

<script async setup lang="ts">
import PageViews from '@yeger/page-views'
import { onMounted, ref } from 'vue'

const views = ref<number>()

PageViews.autoSubmitViews()

onMounted(async () => {
  views.value = await PageViews.getViews()
})
</script>

<template>
  <div class="page-views">
    <span v-if="views === undefined">Loading...</span>
    <span v-else>{{ views }} views</span>
  </div>
</template>

Examples #

React #

Vue #

Examples

React

Vue