Ant-design: рдПрдХрд╛рдзрд┐рдХ рдЪрдпрди рдмреЙрдХреНрд╕ рдореЗрдВ рдЦреЛрдЬ рдлрд╝рдВрдХреНрд╢рди рд▓реЗрдмрд▓ рдХреЗ рдмрдЬрд╛рдп рдорд╛рдиреЛрдВ рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рд▓реВрдк рдХрд░рддрд╛ рд╣реИред

рдХреЛ рдирд┐рд░реНрдорд┐рдд 15 рдирд╡ре░ 2017  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: ant-design/ant-design

рдпрд╣ рд╕реБрд╡рд┐рдзрд╛ рдХрд┐рд╕ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рдорд╛рдзрд╛рди рдХрд░рддреА рд╣реИ?

рдореИрдВ рдореВрд▓реНрдп рдХреЗ рд░реВрдк рдореЗрдВ user_id рдФрд░ рд▓реЗрдмрд▓ рдХреЗ рд░реВрдк рдореЗрдВ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдирд╛рдо рдХреЗ рд╕рд╛рде рдПрдХ рдЪреБрдирд┐рдВрджрд╛ рдЗрдирдкреБрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдмрд╣реБ-рдЪрдпрди рдореЛрдб рдореЗрдВ рд╕реНрд╡рдЪрд╛рд▓рд┐рдд рдЦреЛрдЬ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╕рдордп, рдпрд╣ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдирд╛рдо/рд▓реЗрдмрд▓ рдХреЗ рдмрдЬрд╛рдп рдПрдХ рдЖрдИрдбреА/рдорд╛рди рдХреА рдЦреЛрдЬ рдХрд░ рд░рд╣рд╛ рд╣реИред

рдкреНрд░рд╕реНрддрд╛рд╡рд┐рдд рдПрдкреАрдЖрдИ рдХреИрд╕рд╛ рджрд┐рдЦрддрд╛ рд╣реИ?

рдЪреБрдирд┐рдВрджрд╛ рдЗрдирдкреБрдЯ рдХреЛ рдкреИрд░рд╛рдореАрдЯрд░ рджреЗрдирд╛ рдЕрдЪреНрдЫрд╛ рд╣реЛрдЧрд╛ рдЬреИрд╕реЗ:

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдирд┐рд░реНрджреЗрд╢реЛрдВ рдХреЗ рдЕрдиреБрд╕рд╛рд░, http://new-issue.ant.design . рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдирдП рдореБрджреНрджреЗ рдмрдирд╛рдП рдЬрд╛рдиреЗ рдЪрд╛рд╣рд┐рдП

optionFilterProp рдФрд░ filterOption рдЖрдкрдХреЛ рдЙрдкрд▓рдмреНрдз рд╡рд┐рдХрд▓реНрдкреЛрдВ рдХреЛ рдлрд╝рд┐рд▓реНрдЯрд░ рдХрд░рдиреЗ рдХрд╛ рддрд░реАрдХрд╛ рдкреНрд░рдмрдВрдзрд┐рдд рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрддреЗ рд╣реИрдВ, рдЕрд░реНрдерд╛рдд

<Select
    showSearch
    optionFilterProp="children"
    filterOption={(input: any, option: any) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
   >
   ...
</Select>

рдЙрдкрд░реЛрдХреНрдд рдорд╛рдорд▓реЗ рдХреЛ рдлрд╝рд┐рд▓реНрдЯрд░ рдХрд░реЗрдЧрд╛ рд▓реЗрдмрд▓ рджреНрд╡рд╛рд░рд╛ рдЙрдкрд▓рдмреНрдз рд╡рд┐рдХрд▓реНрдкреЛрдВ рдХреЛ рдЕрд╕рдВрд╡реЗрджрдирд╢реАрд▓ рд░реВрдк рд╕реЗ рдлрд╝рд┐рд▓реНрдЯрд░ рдХрд░реЗрдЧрд╛ред

рдпрд╣ рджрд╕реНрддрд╛рд╡реЗрдЬрд╝реАрдХрд░рдг рдкрд░ рджрд┐рдЦрд╛рдпрд╛ рдЧрдпрд╛ рд╣реИ https://ant.design/components/select/#components -select-demo-search

рдПрдЪрдЯреАрдПрдЪ

рд╕рднреА 3 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдирд┐рд░реНрджреЗрд╢реЛрдВ рдХреЗ рдЕрдиреБрд╕рд╛рд░, http://new-issue.ant.design . рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдирдП рдореБрджреНрджреЗ рдмрдирд╛рдП рдЬрд╛рдиреЗ рдЪрд╛рд╣рд┐рдП

optionFilterProp рдФрд░ filterOption рдЖрдкрдХреЛ рдЙрдкрд▓рдмреНрдз рд╡рд┐рдХрд▓реНрдкреЛрдВ рдХреЛ рдлрд╝рд┐рд▓реНрдЯрд░ рдХрд░рдиреЗ рдХрд╛ рддрд░реАрдХрд╛ рдкреНрд░рдмрдВрдзрд┐рдд рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрддреЗ рд╣реИрдВ, рдЕрд░реНрдерд╛рдд

<Select
    showSearch
    optionFilterProp="children"
    filterOption={(input: any, option: any) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
   >
   ...
</Select>

рдЙрдкрд░реЛрдХреНрдд рдорд╛рдорд▓реЗ рдХреЛ рдлрд╝рд┐рд▓реНрдЯрд░ рдХрд░реЗрдЧрд╛ рд▓реЗрдмрд▓ рджреНрд╡рд╛рд░рд╛ рдЙрдкрд▓рдмреНрдз рд╡рд┐рдХрд▓реНрдкреЛрдВ рдХреЛ рдЕрд╕рдВрд╡реЗрджрдирд╢реАрд▓ рд░реВрдк рд╕реЗ рдлрд╝рд┐рд▓реНрдЯрд░ рдХрд░реЗрдЧрд╛ред

рдпрд╣ рджрд╕реНрддрд╛рд╡реЗрдЬрд╝реАрдХрд░рдг рдкрд░ рджрд┐рдЦрд╛рдпрд╛ рдЧрдпрд╛ рд╣реИ https://ant.design/components/select/#components -select-demo-search

рдПрдЪрдЯреАрдПрдЪ

рдзрдиреНрдпрд╡рд╛рдж рдЧреЗрд╡рд┐рди!

рдХреЛрдИ рд╕рдорд╕реНрдпрд╛ рдирд╣реАрдВ рд╣реИ @remyvanderwereld

FYI рдХрд░реЗрдВ, рдиреНрдпреВ-рдЗрд╢реНрдпреВ рдЯреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ, рдХреНрдпреЛрдВрдХрд┐ рдореБрджреНрджреЗ рдЕрдиреНрдпрдерд╛ рдбрд┐рдмреНрдмрд╛рдмрдВрдж рд╣реЛ рдЬрд╛рддреЗ рд╣реИрдВред

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

xtznhzxdev picture xtznhzxdev  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

lifeneedspassion picture lifeneedspassion  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

kevyu picture kevyu  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

taikongfeizhu picture taikongfeizhu  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

longzb picture longzb  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ