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