useToggle

useToggle

ユーティリティ関数を備えたブール値のスイッチャー。

使用法

import { useToggle } from '@vueuse/core'

const [value, toggle] = useToggle()

ref を渡すと、useToggle は代わりにシンプルなトグル関数を返します:

import { useDark, useToggle } from '@vueuse/core'

const isDark = useDark()
const toggleDark = useToggle(isDark)

注意: トグル関数は最初の引数をオーバーライド値として受け取ることに注意してください。テンプレート内でイベントに直接関数を渡すことは避けた方が良いかもしれません。イベントオブジェクトが渡されるためです。

<!-- 注意: $event が渡されます -->
<button @click="toggleDark" />
<!-- これを推奨します -->
<button @click="toggleDark()" />