useHydration composable | Quasar Framework

The useHydration composable is useful when you build for SSR (but can be used for non SSR builds as well). It is a lower level util of the QNoSsr component.

Syntax

import { useHydration } from 'quasar'

setup () {
  const { isHydrated } = useHydration()
}

function useHydration(): {
  isHydrated: Ref<boolean>;
};

Example

<template>
  <div>
    <div v-if="isHydrated">
      Gets rendered only after hydration.
    </div>
  </div>
</template>

<script>
import { useHydration } from 'quasar'

export default {
  setup () {
    const { isHydrated } = useHydration()

    return {
      isHydrated
    }
  }
}
</script>

Caught a mistake?Edit this page in browser

1. Introduction

2. Syntax

3. Example