useScreenOrientation
| Category | Browser |
|---|---|
| Export Size | 704 B |
| Last Changed | 4 weeks ago |
Reactive Screen Orientation API. It provides web developers with information about the user's current screen orientation.
Usage
import { useScreenOrientation } from '@vueuse/core'
const {
isSupported,
orientation,
angle,
lockOrientation,
unlockOrientation,
} = useScreenOrientation()To lock the orientation, you can pass an OrientationLockType to the lockOrientation function:
import { useScreenOrientation } from '@vueuse/core'
const {
isSupported,
orientation,
angle,
lockOrientation,
unlockOrientation,
} = useScreenOrientation()
lockOrientation('portrait-primary')and then unlock again, with the following:
unlockOrientation()Accepted orientation types are one of "landscape-primary", "landscape-secondary", "portrait-primary", "portrait-secondary", "any", "landscape", "natural" and "portrait".
Type Declarations
/**
* Reactive screen orientation
*
* @see https://vueuse.org/useScreenOrientation
*/
export declare function useScreenOrientation(options?: ConfigurableWindow): {
isSupported: ComputedRef<boolean>
orientation: Ref<OrientationType | undefined>
angle: Ref<number>
lockOrientation: (type: OrientationLockType) => Promise<void>
unlockOrientation: () => void
}
export type UseScreenOrientationReturn = ReturnType<typeof useScreenOrientation>Source
© 2019-present Anthony Fu
Licensed under the MIT License.
https://vueuse.org/core/useScreenOrientation/