From 707e77d7004c5e7e3f7dfc808f0b6c70750692f0 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Wed, 2 Mar 2022 12:15:12 +0800
Subject: [PATCH] =?UTF-8?q?=E8=BE=93=E5=85=A5=E6=A1=86BUG?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 themes/Fukasawa/components/SearchInput.js | 14 +++++++++++++-
 themes/Hexo/components/SearchInput.js     | 15 +++++++++++++--
 themes/Medium/components/SearchInput.js   | 15 ++++++++++++++-
 themes/NEXT/components/SearchInput.js     | 13 +++++++++++++
 4 files changed, 53 insertions(+), 4 deletions(-)

diff --git a/themes/Fukasawa/components/SearchInput.js b/themes/Fukasawa/components/SearchInput.js
index 7a7c4aba..803ce49c 100644
--- a/themes/Fukasawa/components/SearchInput.js
+++ b/themes/Fukasawa/components/SearchInput.js
@@ -36,16 +36,28 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
     setSearchKey('')
   }
 
+  let lock = false
   const updateSearchKey = (val) => {
-    setSearchKey(val)
+    if (!lock) {
+      setSearchKey(val)
+    }
+  }
+  function lockSearchInput () {
+    lock = true
   }
 
+  function unLockSearchInput () {
+    lock = false
+  }
   return <div className='flex w-full bg-gray-100'>
     <input
       ref={searchInputRef}
       type='text'
       className={'w-full text-sm pl-2 transition focus:shadow-lg font-light leading-10 text-black bg-gray-100 dark:bg-gray-900 dark:text-white'}
       onKeyUp={handleKeyUp}
+      onCompositionStart={lockSearchInput}
+      onCompositionUpdate={lockSearchInput}
+      onCompositionEnd={unLockSearchInput}
       onChange={e => updateSearchKey(e.target.value)}
       defaultValue={searchKey}
     />
diff --git a/themes/Hexo/components/SearchInput.js b/themes/Hexo/components/SearchInput.js
index d6ba0884..0912c374 100644
--- a/themes/Hexo/components/SearchInput.js
+++ b/themes/Hexo/components/SearchInput.js
@@ -35,17 +35,28 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
     searchInputRef.current.value = ''
     setSearchKey('')
   }
-
+  let lock = false
   const updateSearchKey = (val) => {
-    setSearchKey(val)
+    if (!lock) {
+      setSearchKey(val)
+    }
+  }
+  function lockSearchInput () {
+    lock = true
   }
 
+  function unLockSearchInput () {
+    lock = false
+  }
   return <div className='flex'>
     <input
       ref={searchInputRef}
       type='text'
       className={'w-full rounded-lg text-sm pl-5 transition focus:shadow-lg font-light leading-10 text-black bg-gray-100'}
       onKeyUp={handleKeyUp}
+      onCompositionStart={lockSearchInput}
+      onCompositionUpdate={lockSearchInput}
+      onCompositionEnd={unLockSearchInput}
       onChange={e => updateSearchKey(e.target.value)}
       defaultValue={currentSearch}
     />
diff --git a/themes/Medium/components/SearchInput.js b/themes/Medium/components/SearchInput.js
index bd704624..baf6f859 100644
--- a/themes/Medium/components/SearchInput.js
+++ b/themes/Medium/components/SearchInput.js
@@ -37,8 +37,18 @@ const SearchInput = ({ currentTag, currentSearch, cRef, className }) => {
     setSearchKey('')
   }
 
+  let lock = false
   const updateSearchKey = (val) => {
-    setSearchKey(val)
+    if (!lock) {
+      setSearchKey(val)
+    }
+  }
+  function lockSearchInput () {
+    lock = true
+  }
+
+  function unLockSearchInput () {
+    lock = false
   }
 
   return <div className={'flex w-full bg-gray-100 ' + className}>
@@ -47,6 +57,9 @@ const SearchInput = ({ currentTag, currentSearch, cRef, className }) => {
       type='text'
       className={'w-full text-sm pl-2 transition focus:shadow-lg font-light leading-10 text-black bg-gray-100 dark:bg-gray-900 dark:text-white'}
       onKeyUp={handleKeyUp}
+      onCompositionStart={lockSearchInput}
+      onCompositionUpdate={lockSearchInput}
+      onCompositionEnd={unLockSearchInput}
       onChange={e => updateSearchKey(e.target.value)}
       defaultValue={searchKey}
     />
diff --git a/themes/NEXT/components/SearchInput.js b/themes/NEXT/components/SearchInput.js
index 99e54ec1..153001e0 100644
--- a/themes/NEXT/components/SearchInput.js
+++ b/themes/NEXT/components/SearchInput.js
@@ -39,9 +39,19 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
     searchInputRef.current.value = ''
     setShowClean(false)
   }
+  let lock = false
+  function lockSearchInput () {
+    lock = true
+  }
 
+  function unLockSearchInput () {
+    lock = false
+  }
   const [showClean, setShowClean] = useState(false)
   const updateSearchKey = (val) => {
+    if (lock) {
+      return
+    }
     searchInputRef.current.value = val
     if (val) {
       setShowClean(true)
@@ -57,6 +67,9 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
       placeholder={currentTag ? `${locale.SEARCH.TAGS} #${currentTag}` : `${locale.SEARCH.ARTICLES}`}
       className={'w-full text-sm pl-4 transition focus:shadow-lg font-light leading-10 border-gray-300 text-black bg-gray-100 dark:bg-gray-900 dark:text-white'}
       onKeyUp={handleKeyUp}
+      onCompositionStart={lockSearchInput}
+      onCompositionUpdate={lockSearchInput}
+      onCompositionEnd={unLockSearchInput}
       onChange={e => updateSearchKey(e.target.value)}
       defaultValue={currentSearch}
     />