fix(Select): can not input spaces to search, close #1047

ksc-fe · Nov 21, 2024 · a03935d · a03935d
1 parent e3c450a
commit a03935d
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 6 deletions.
diff --git a/components/select/base.vdt b/components/select/base.vdt
@@ -54,7 +54,6 @@ const filterInput = <Input v-if={filterable}
     readonly={!show}
     waveDisabled={true}
     flat={flat}
-    frozenOnInput
 />
 
 <ErrorContext.Consumer defaultValue={false}>
@@ -96,7 +95,6 @@ const filterInput = <Input v-if={filterable}
                                 readonly={!show}
                                 waveDisabled={true}
                                 flat={flat}
-                                frozenOnInput
                             />
                             <div class={`${k}-select-placeholder c-ellipsis`}
                                 v-else-if={!filterable && !hasValue}

diff --git a/components/select/useFilterable.ts b/components/select/useFilterable.ts
@@ -22,7 +22,7 @@ export function useFilterable(keywords: State<string>) {
 
     function getCreatedVNode(children: (VNode | string | number)[]) {
         const {creatable, filterable} = component.get();
-        const _keywords = keywords.value;
+        const _keywords = keywords.value.trim();
         if (creatable && filterable && _keywords) {
             if (!children.find(vNode => {
                 // TODO: create Option for OptionGroup
@@ -66,7 +66,7 @@ export function useFilterable(keywords: State<string>) {
                         vNode.key = value;
                     }
 
-                    if (filter!(keywords.value, vNode.props)) {
+                    if (filter!(keywords.value.trim(), vNode.props)) {
                         _children.push(vNode);
                     }
                 } else if (isComponentVNode(vNode, OptionGroup)) {

diff --git a/components/select/useInput.ts b/components/select/useInput.ts
@@ -23,7 +23,12 @@ export function useInput(resetKeywords: (keywords: State<string>) => void) {
     const inputRef = createRef<Input>();
 
     function onInput(value: string) {
-        keywords.set(value.trim());
+        /**
+         * can not trim the keywords, otherwise we can not input spaces
+         * https://github.com/ksc-fe/kpc/issues/1047
+         */
+        // keywords.set(value.trim());
+        keywords.set(value);
 
         const dropdown = component.dropdownRef.value!;
         // the position may be flip, and the select input height may change height too,

diff --git a/components/treeSelect/index.ts b/components/treeSelect/index.ts
@@ -124,7 +124,7 @@ export class TreeSelect<
 
     @bind
     private filter(data: DataItem<K>) {
-        let keywords = this.input.keywords.value;
+        let keywords = this.input.keywords.value.trim();
         if (!keywords) return true;
 
         const {filter} = this.get();