Documentation: Select with search field

Hello,

The documentation of the Select Component explains how to search among differents options. The ‘Select with search field’ example shows:

  <Select
    showSearch
    style={{ width: 200 }}
    placeholder="Select a person"
    optionFilterProp="children"
    onChange={handleChange}
    filterOption={(input, option) => option.props.value.toLowerCase().indexOf(input.toLowerCase()) >= 0}
  >
    <Option value="jack">Jack</Option>
    <Option value="lucy">Lucy</Option>
    <Option value="tom">Tom</Option>
  </Select>

The filter option is right in this example:

    filterOption={(input, option) => option.props.value.toLowerCase().indexOf(input.toLowerCase()) >= 0}

But, it’s right because the value and the children match. However, if they are different it won’t work 😢

In my humble opinion, I think this example is more accurate (and more useful!):

    filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}

What do you think about it?

Best regards, Aaron Planell

[yesmeck]

Oh, got your point, could you send a PR?

[aaronplanell]

Hi @yesmeck !

I totally agree, but maybe it’s a little bit confusing. Probably it will be more useful with children instead of value and it will work the same way. I think other developers will enjoy this update at the documentation.

Best regards!