From 9f372af1ec663b4a69e27d3a62600d3b5606a272 Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Wed, 26 Aug 2020 10:36:07 +0800
Subject: [PATCH] feat: add useToggle

---
 src/api/use-toggle.ts            | 10 ++++++++++
 src/calendar/components/Month.js |  9 +++------
 2 files changed, 13 insertions(+), 6 deletions(-)
 create mode 100644 src/api/use-toggle.ts

diff --git a/src/api/use-toggle.ts b/src/api/use-toggle.ts
new file mode 100644
index 000000000..bd6a281be
--- /dev/null
+++ b/src/api/use-toggle.ts
@@ -0,0 +1,10 @@
+import { ref } from 'vue';
+
+export function useToggle(defaultValue = false) {
+  const state = ref(defaultValue);
+  const setState = (value: boolean) => {
+    state.value = value;
+  };
+
+  return [state, setState];
+}
diff --git a/src/calendar/components/Month.js b/src/calendar/components/Month.js
index 06c7f4197..5bd6591d0 100644
--- a/src/calendar/components/Month.js
+++ b/src/calendar/components/Month.js
@@ -11,6 +11,7 @@ import {
   getNextDay,
   formatMonthTitle,
 } from '../utils';
+import { useToggle } from '../../api/use-toggle';
 import { getMonthEndDay } from '../../datetime-picker/utils';
 import Day from './Day';
 
@@ -37,7 +38,7 @@ export default createComponent({
   emits: ['click'],
 
   setup(props, { emit }) {
-    const visible = ref(false);
+    const [visible, setVisible] = useToggle();
     const daysRef = ref(null);
     const monthRef = ref(null);
 
@@ -82,10 +83,6 @@ export default createComponent({
       return height;
     };
 
-    const setVisible = (value) => {
-      visible.value = value;
-    };
-
     const getDate = () => props.data;
 
     const getTitle = () => title.value;
@@ -141,7 +138,7 @@ export default createComponent({
 
       const compareToEnd = compareDay(day, endDay);
 
-      if (compareToStart === 0 && compareToEnd === 0 && props.allowSameDay) {
+      if (props.allowSameDay && compareToStart === 0 && compareToEnd === 0) {
         return 'start-end';
       }
       if (compareToStart === 0) {