select
select copied to clipboard
fix: onChange 参数可以为 `undefined`
This is
- [x] bug fix
- [x] TypeScript definition update
Background and solution
select 的 onChange 参数定义的类型不能为 undefined
,但是当显示 clear
icon,并点击清空选项时,会调用 onChange
事件,通过 console.log
打印出来的 value
和 option
为 undefined
function CustomSelect({ children, ...rest }: SelectProps) {
return (
<>
<Select
{...rest}
onChange={(value, option) => {
// 提示类型都不能为 undefined,
// 但是当点击 clear icon 时,打印出的 value 和 option 为 undefined
console.log(value, option);
rest.onChange?.(value, option);
}}
>
{children}
</Select>
<button
onClick={() => {
rest.onChange?.(undefined, []); // 类型错误,提示 value 不能为 undefined
rest.onChange?.("male", undefined); // 类型错误 option 不能为 undefined
}}
>
扩展按钮
</button>
</>
);
}
demo
https://codesandbox.io/s/gallant-worker-ik998?file=/src/App.tsx
This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.
🔍 Inspect: https://vercel.com/react-component/select/4tJtnLdztUEWRR8SX2HzFQd5aBZt
✅ Preview: https://select-git-fork-nia3y-patch-1-react-component.vercel.app
Codecov Report
Merging #666 (eef08ee) into master (95aa5b9) will not change coverage. The diff coverage is
n/a
.
@@ Coverage Diff @@
## master #666 +/- ##
=======================================
Coverage 99.11% 99.11%
=======================================
Files 20 20
Lines 1013 1013
Branches 345 346 +1
=======================================
Hits 1004 1004
Misses 8 8
Partials 1 1
Impacted Files | Coverage Δ | |
---|---|---|
src/generate.tsx | 99.39% <ø> (ø) |
|
src/interface/generator.ts | 100.00% <ø> (ø) |
Continue to review full report at Codecov.
Legend - Click here to learn more
Δ = absolute <relative> (impact)
,ø = not affected
,? = missing data
Powered by Codecov. Last update 95aa5b9...eef08ee. Read the comment docs.