useZoomLevel

Category

@Electron

Export Size

346 B

Package

@reause/electron

Last Changed

5 days ago

Reactive WebFrame zoom level.

Demo

Usage

import { useZoomLevel } from '@reause/electron'

// enable nodeIntegration if you don't provide webFrame explicitly
// see: https://www.electronjs.org/docs/api/webview-tag#nodeintegration
// tuple result will return
const [level, setLevel] = useZoomLevel()
console.log(level) // print current zoom level
setLevel(2) // change current zoom level

Set initial zoom level immediately

import { useZoomLevel } from '@reause/electron'

const [level] = useZoomLevel(2)

Pass a state value and the level will be updated when the source value changes

import { useZoomLevel } from '@reause/electron'
import { useState } from 'react'

const [level, setLevel] = useState(1)

useZoomLevel(level) // zoom level will match with the state

setLevel(2) // zoom level will change

Type Declarations

export type ZoomLevelSetter = (value: number) => void

export function useZoomLevel(level?: number): [
    number,
    ZoomLevelSetter
]

export function useZoomLevel(webFrame: WebFrame, level?: number): [
    number,
    ZoomLevelSetter
]

Source

Source · Demo · VueUse

Contributors

Changelog

v0.1.0 on

b7274 - fix(electron): resolve useZoomLevel audit findings (#812)

1c968 - feat(electron): add useZoomFactor, useZoomLevel (#256, #257)