Svelte参考文档

svelte/reactivity/window

此模块导出了各种 window 值的响应式版本，每个值都有一个响应式的 current 属性，你可以在响应式上下文（模板、deriveds 和 effects）中引用这些属性，而无需使用 <svelte:window> 绑定或手动创建自己的事件监听器。

<script>
	import { innerWidth, innerHeight } from 'svelte/reactivity/window';
</script>

<p>{innerWidth.current}x{innerHeight.current}</p>

import {
	const devicePixelRatio: {
    readonly current: number | undefined;
}devicePixelRatio.current is a reactive view of window.devicePixelRatio. On the server it is undefined.
Note that behaviour differs between browsers — on Chrome it will respond to the current zoom level,
on Firefox and Safari it won’t.
@since5.11.0devicePixelRatio,
	const innerHeight: ReactiveValue<number | undefined>innerHeight.current is a reactive view of window.innerHeight. On the server it is undefined.
@since5.11.0innerHeight,
	const innerWidth: ReactiveValue<number | undefined>innerWidth.current is a reactive view of window.innerWidth. On the server it is undefined.
@since5.11.0innerWidth,
	const online: ReactiveValue<boolean | undefined>online.current is a reactive view of navigator.onLine. On the server it is undefined.
@since5.11.0online,
	const outerHeight: ReactiveValue<number | undefined>outerHeight.current is a reactive view of window.outerHeight. On the server it is undefined.
@since5.11.0outerHeight,
	const outerWidth: ReactiveValue<number | undefined>outerWidth.current is a reactive view of window.outerWidth. On the server it is undefined.
@since5.11.0outerWidth,
	const screenLeft: ReactiveValue<number | undefined>screenLeft.current is a reactive view of window.screenLeft. It is updated inside a requestAnimationFrame callback. On the server it is undefined.
@since5.11.0screenLeft,
	const screenTop: ReactiveValue<number | undefined>screenTop.current is a reactive view of window.screenTop. It is updated inside a requestAnimationFrame callback. On the server it is undefined.
@since5.11.0screenTop,
	const scrollX: ReactiveValue<number | undefined>scrollX.current is a reactive view of window.scrollX. On the server it is undefined.
@since5.11.0scrollX,
	const scrollY: ReactiveValue<number | undefined>scrollY.current is a reactive view of window.scrollY. On the server it is undefined.
@since5.11.0scrollY
} from 'svelte/reactivity/window';

devicePixelRatio

devicePixelRatio.current 是 window.devicePixelRatio 的响应式视图。在服务端它是 undefined。注意不同浏览器的行为有所不同 — 在 Chrome 中它会响应当前缩放级别，在 Firefox 和 Safari 中则不会。

const devicePixelRatio: {
	get current(): number | undefined;
};

innerHeight

innerHeight.current 是 window.innerHeight 的响应式视图。在服务端它是 undefined。

const innerHeight: ReactiveValue<number | undefined>;

innerWidth

innerWidth.current 是 window.innerWidth 的响应式视图。在服务端它是 undefined。

const innerWidth: ReactiveValue<number | undefined>;

online

online.current 是 navigator.onLine 的响应式视图。在服务端它是 undefined。

const online: ReactiveValue<boolean | undefined>;

outerHeight

outerHeight.current 是 window.outerHeight 的响应式视图。在服务端它是 undefined。

const outerHeight: ReactiveValue<number | undefined>;

outerWidth

outerWidth.current 是 window.outerWidth 的响应式视图。在服务端它是 undefined。

const outerWidth: ReactiveValue<number | undefined>;

screenLeft

screenLeft.current 是 window.screenLeft 的响应式视图。它在 requestAnimationFrame 回调中更新。在服务端它是 undefined。

const screenLeft: ReactiveValue<number | undefined>;

screenTop

screenTop.current 是 window.screenTop 的响应式视图。它在 requestAnimationFrame 回调中更新。在服务端它是 undefined。

const screenTop: ReactiveValue<number | undefined>;

scrollX

scrollX.current 是 window.scrollX 的响应式视图。在服务端它是 undefined。

const scrollX: ReactiveValue<number | undefined>;

scrollY

scrollY.current 是 window.scrollY 的响应式视图。在服务端它是 undefined。

const scrollY: ReactiveValue<number | undefined>;

在 GitHub 编辑此页面

svelte/motion svelte/reactivity