DouyinFE / semi-design

🚀A modern, comprehensive, flexible design system and React UI library. 🎨 Provide more than 3000+ Design Tokens, easy to build your design system. Make Semi Design to Any Design. 🧑🏻‍💻 Design to Code in one click
https://semi.design
Other
8.19k stars 695 forks source link

[BUG] Select search no highlight when use OptGroup #1930

Closed DaiQiangReal closed 9 months ago

DaiQiangReal commented 9 months ago

Is there an existing issue for this?

Which Component

select

Semi Version

latest

Current Behavior

搜索没高亮

Expected Behavior

Steps To Reproduce

import React from 'react'; import { Select, Popover } from '@douyinfe/semi-ui';

() => { function searchLabel(sugInput, option) { let label = option.vLabel.toUpperCase(); let sug = sugInput.toUpperCase(); return label.includes(sug); } return ( <Select filter={searchLabel} style={{ width: '180px' }} placeholder="try abc">

ABC
HOTSOON
PIPIXIA
XIGUA
); }; ### ReproducibleCode _No response_ ### Environment ```markdown - OS: - browser: ``` ### Anything else? _No response_
pointhalo commented 9 months ago

这个bug没有复现,当前官网部署版本 v2.48.0-beta.0

image

pointhalo commented 9 months ago

v2.47 同样没有

https://codesandbox.io/p/sandbox/condescending-sammet-ggknv7?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clpgxswd200073b6h62qbhy3s%2522%252C%2522sizes%2522%253A%255B70%252C30%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clpgxswd100033b6h2kuafvv1%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clpgxswd200043b6hy3y028nf%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clpgxswd200063b6hkxglgv4a%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clpgxswd100033b6h2kuafvv1%2522%253A%257B%2522id%2522%253A%2522clpgxswd100033b6h2kuafvv1%2522%252C%2522tabs%2522%253A%255B%255D%257D%252C%2522clpgxswd200063b6hkxglgv4a%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clpgxswd200053b6h3fssaks2%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%2522%257D%255D%252C%2522id%2522%253A%2522clpgxswd200063b6hkxglgv4a%2522%252C%2522activeTabId%2522%253A%2522clpgxswd200053b6h3fssaks2%2522%257D%252C%2522clpgxswd200043b6hy3y028nf%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522clpgxswd200043b6hy3y028nf%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Atrue%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D