reactjs - 在 react-select-search 输入名称时，结果被填充

Question

由于我是新手，我在 react.js 中尝试搜索过滤器。使用 react-search-filter 我尝试过 react-select-search 并且在搜索选项时正在填充

在我输入名称选项后得到填充

我期待我在单击输入按钮时输入的唯一搜索结果。请帮忙谢谢

代码 App.js

import React from 'react';
import {friends} from './data.js';
import SelectSearch from 'react-select-search';

class App extends React.Component {
  constructor(props) {
    super(props);


  }

  render() {

    function renderFriend(option) {
      const imgStyle = {
          borderRadius: '50%',
          verticalAlign: 'middle',
          marginRight: 10,
      };

      return (<span><img alt="" style={imgStyle} width="40" height="40" src={option.photo} /><span>{option.name}</span></span>);
  }


    return (
      <div className="App">
     <div className="container">
    <div className="row">
    <SelectSearch

    autofocus={true} 
    isSearchable={true}

                        value='one'
                        options={friends}
                        renderOption={renderFriend}
                    />

    </div>
  </div>
      </div>
    );
  }
}

export default App;

数据.js

export const friends = [

    {name: 'Pencil', value: 'Apsara', company: "Apsara",photo: './img/pencil_2.jpg'},
    {name: 'book', value: 'Navneet', company: "navneet",photo: './img/pen_1.png'},
    {name: 'pen', value: 'Parker', company: "parker",photo: './img/pen_1.png'},
    {name: 'Pencil', value: 'Apsara', company: "Apsara",photo: './img/pencil_2.jpg'},


];

标签： reactjsreact-select-search