Skip to content

Commit 42b321e

Browse files
ArgoZhangSamXMG
andauthored
refactor(Select): reuse input composing function (#4971)
* chore: bump version 9.1.9-beta01 Co-Authored-By: SamXMG <[email protected]> * refactor: 提高代码复用率 * refactor: 重构代码 * Revert "chore: bump version 9.1.9-beta01" This reverts commit b9f6deb. # Conflicts: # src/BootstrapBlazor/BootstrapBlazor.csproj --------- Co-authored-by: SamXMG <[email protected]>
1 parent b434bdb commit 42b321e

File tree

2 files changed

+20
-44
lines changed

2 files changed

+20
-44
lines changed

src/BootstrapBlazor/Components/Select/Select.razor.js

Lines changed: 9 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import Data from "../../modules/data.js"
33
import EventHandler from "../../modules/event-handler.js"
44
import Popover from "../../modules/base-popover.js"
5+
import Input from "../../modules/input.js"
56

67
export function init(id, invoke, options) {
78
const el = document.getElementById(id)
@@ -10,7 +11,7 @@ export function init(id, invoke, options) {
1011
return
1112
}
1213

13-
const search = el.querySelector("input.search-text")
14+
const search = el.querySelector(".search-text")
1415
const popover = Popover.init(el)
1516

1617
const shown = () => {
@@ -73,31 +74,17 @@ export function init(id, invoke, options) {
7374
EventHandler.on(el, 'shown.bs.dropdown', shown);
7475
EventHandler.on(el, 'keydown', keydown)
7576

77+
const onSearch = debounce(v => invoke.invokeMethodAsync(searchMethodCallback, v));
78+
if (search) {
79+
Input.composition(search, onSearch);
80+
}
81+
7682
const select = {
7783
el,
84+
search,
7885
popover
7986
}
8087
Data.set(id, select);
81-
82-
const onSearch = debounce(v => invoke.invokeMethodAsync(searchMethodCallback, v));
83-
let isComposing = false;
84-
85-
EventHandler.on(el, 'input', '.search-text', e => {
86-
if (isComposing) {
87-
return;
88-
}
89-
90-
onSearch(e.delegateTarget.value);
91-
});
92-
93-
EventHandler.on(el, 'compositionstart', '.search-text', e => {
94-
isComposing = true;
95-
});
96-
97-
EventHandler.on(el, 'compositionend', '.search-text', e => {
98-
isComposing = false;
99-
onSearch(e.delegateTarget.value);
100-
});
10188
}
10289

10390
export function show(id) {
@@ -129,14 +116,11 @@ export function dispose(id) {
129116
if (select) {
130117
EventHandler.off(select.el, 'shown.bs.dropdown')
131118
EventHandler.off(select.el, 'keydown');
132-
EventHandler.off(select.el, 'input');
133-
EventHandler.off(select.el, 'compositionstart');
134-
EventHandler.off(select.el, 'compositionend')
135119
Popover.dispose(select.popover)
120+
Input.dispose(select.search);
136121
}
137122
}
138123

139-
140124
function scrollToActive(el, activeItem) {
141125
if (!activeItem) {
142126
activeItem = el.querySelector('.dropdown-item.active')

src/BootstrapBlazor/wwwroot/modules/input.js

Lines changed: 11 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,25 @@
11
import EventHandler from "./event-handler.js"
22

33
export default {
4-
composition(id, invoke, callback) {
5-
const el = document.getElementById(id)
4+
composition(el, callback) {
65
if (el) {
7-
var isInputZh = false
6+
let isComposing = false
87
EventHandler.on(el, 'compositionstart', e => {
9-
isInputZh = true
10-
})
8+
isComposing = true;
9+
});
1110
EventHandler.on(el, 'compositionend', e => {
12-
isInputZh = false
13-
})
11+
isComposing = false;
12+
callback(el.value);
13+
});
1414
EventHandler.on(el, 'input', e => {
15-
if (isInputZh) {
16-
e.stopPropagation()
17-
e.preventDefault()
18-
const handler = setTimeout(() => {
19-
if (!isInputZh) {
20-
clearTimeout(handler)
21-
invoke.invokeMethodAsync(callback, el.value)
22-
}
23-
}, 15)
15+
if (!isComposing) {
16+
callback(el.value);
2417
}
25-
})
18+
});
2619
}
2720
},
2821

29-
dispose(id) {
30-
const el = document.getElementById(id)
22+
dispose(el) {
3123
if (el) {
3224
EventHandler.off(el, 'compositionstart')
3325
EventHandler.off(el, 'compositionend')

0 commit comments

Comments
 (0)