how to clear and select items programmatically

If you are using React Hooks, use the following:

import React, { useState } from 'react'import { Button, Select } from 'antd'const { Option } = Select// inside your componentconst ComponentName = () => {  const [selected, setSelected] = useState()  // handler  const clearSelected = () => {    // this line will clear the select    // when you click on the button    setSelected(null)  }  // in the return value  return (    <>      // ...      // In the select element      <Select style={{ width: 150 }} onChange={value => setSelected(value)}         value={selected}>        <Option value="jack">Jack</Option>        <Option value="lucy">Lucy</Option>      </Select>      <Button onClick={clearSelected}>Clear Selected</Button>    </>  )}

Just set value to null.e.g.

<Select value={null} />

Try this

    class Banana extends React.Component {          constructor() {            super();            this.state = {        selected: []};            this.handleChange = this.handleChange.bind(this);            this.clearSelected = this.clearSelected.bind(this);          }          handleChange(value) {            this.setState({ selected: value });          }          clearSelected() {            this.setState({ selected: []});          }          render() {            return (              <div>                <Select value={this.state.selected} style={{ width: 120 }} onChange={this.handleChange} placeholder="Select option">                  <Option value="jack">Jack</Option>                  <Option value="lucy">Lucy</Option>                  <Option value="disabled" disabled>Disabled</Option>                  <Option value="Yiminghe">yiminghe</Option>                </Select>                <Button onClick={this.clearSelected}>clear selected</Button>              </div>            );          }        }