useToggle #

<template>
  <div>
    <p>Boolean 切换</p>
    <p>{{state}}</p>
    <button @click="toggle()">toggle</button>
    <button @click="setLeft">setLeft</button>
    <button @click="setRight">setRight</button>
  </div>
  <div>
    <p>任意两值直接切换</p>
    <p>{{stringState}}</p>
    <button @click="toggleString()">toggle</button>
    <button @click="toggleString('a')">toggle a</button>
    <button @click="toggleString('b')">toggle b</button>
    <button @click="setStringLeft">setLeft</button>
    <button @click="setStringRight">setRight</button>
  </div>
  
</template>

<script>
  import { useToggle } from "@/landao/hooks";
  export default {
    setup () {
      const {
        state,
        toggle,
        setLeft,
        setRight
      } = useToggle()

      const {
        state: stringState,
        toggle: toggleString,
        setLeft: setStringLeft,
        setRight: setStringRight
      } = useToggle('a', 'b')
      return {
        state,
        toggle,
        setLeft,
        setRight,

        stringState,
        toggleString,
        setStringLeft,
        setStringRight
      }
    }
  }
</script>