在react-select包中選擇項目后刪除邊框顏色

Question

從此軟件包的下拉列表中選擇項目后如何刪除邊框顏色https://www.npmjs.com/package/react-select

在gif圖像中，選中該項目后，紅色仍然突出顯示控件，單擊外部將使紅色消失。 但是如何使它在選擇項目后立即消失

樣本鏈接

Answer 1

react-select公開了blur方法，可用於以編程方式管理react-select的狀態。 文件參考

export default class Example extends React.Component {
  rSelecRef = null;

  render() {
    return (
      <Select
        ref={item => (this.rSelecRef = item)}
        defaultValue={flavourOptions[2]}
        options={flavourOptions}
        onChange={() => this.rSelecRef.blur()}
        label="Single select"
        placeholder="Single select 1"
        isClearable
        theme={theme => ({
          ...theme,
          borderRadius: 0,
          color: "green",
          colors: {
            ...theme.colors,
            primary: "#b90000",
            primary25: "#c9cad0",
            primary50: "#c9cad0"
          }
        })}
      />
    );
  }
}

它適用於此特定方案。 這是更新代碼和框的鏈接。

https://codesandbox.io/s/n5vo76r02l