useSSRWidth

類別

瀏覽器

導出大小

上次變更

3 個月前

用於設定全域視口寬度，以便在渲染依賴視口寬度的 SSR 組件時使用，例如 useMediaQuery 或 useBreakpoints

用法

import { provideSSRWidth } from '@vueuse/core'

const app = createApp(App)

provideSSRWidth(500, app)

或在根組件中

<script setup>
import { provideSSRWidth } from '@vueuse/core'

provideSSRWidth(500)
</script>

若您需要在子組件中檢索所提供的值

<script setup>
import { useSSRWidth } from '@vueuse/core'

const width = useSSRWidth()
</script>

類型宣告

export declare function useSSRWidth(): number | undefined
export declare function provideSSRWidth(
  width: number | null,
  app?: App<unknown>,
): void

來源

Source • 文件

貢獻者

Anthony Fu

Adrien Foulon

更新日誌

v12.1.0 於 2024/12/22

55965 - feat: add optional support for SSR in useMediaQuery and useBreakpoints (#4317)