vue-compositions

useBoolean

用于管理 Boolean 状态的 Hook

API 

const {
  state,
  toggle,
  setTrue,
  setFalse
} = useBoolean(defaultValue?: boolean)

Params

参数说明类型默认值
defaultValue初始默认状态booleanfalse

Methods

该 Hook 返回以下函数：

函数名类型描述
toggle(next?: boolean) => void用于反转状态
setTrue() => void将状态设置为 true
setFalse() => void将状态设置为 false

Example

false

Code 

<template>
  <p>{{ state }}</p>
  <button @click="toggle()">toggle</button>
  <button @click="setTrue">True</button>
  <button @click="setFalse">False</button>
</template>

<script>
import { useBoolean } from "vue-compositions";
export default {
  setup() {
    const res = useBoolean();
    return {
      ...res,
    };
  },
};
</script>