Передача объекта в обратный вызов onSelect не работает должным образом - PullRequest
0 голосов
/ 20 февраля 2019

Я использую выпадающий список реакции-начальной загрузки.Согласно документации , реквизит eventKey будет передан обработчику onSelect при выборе выпадающего элемента.

Я пытаюсь установить eventKey для объектаи передал это моему обработчику handleSelect(e), но когда я console.log() передал значение моему обработчику, он дает мне строку [object Object].

Мой компонент выглядит следующим образом:

const CustomDropdown = props => {
  function handleSelect(e) {
    console.log(e); 
    //I expect this to print { name: 'genre', label: 'Genres' } but 
    //it prints '[object Object]'
  }

  return (
    <Dropdown>
      <Dropdown.Toggle as={React.Button} variant="link" id="dropdown-basic">
        {props.text}
      </Dropdown.Toggle>

      <Dropdown.Menu>
        {props.choices.map((choice, i) => (    //choices is an array of objects
          <Dropdown.Item
            key={i}
            eventKey={choice}        //The object I'm passing in. See below
            onSelect={handleSelect}>
            {choice.label}
          </Dropdown.Item>
        ))}
      </Dropdown.Menu>
    </Dropdown>
  );
};

Объект choice выглядит следующим образом:

{
  name: 'genre',
  label: 'Genres',
}

Однако, если я заменю свою onSelect={handleSelect} опору нафункция стрелки onSelect={() => handleSelect(choice)}, объект правильно передается в handleSelect, как я хочу.Почему метод функции arrow передает объект, а оригинальный метод - нет?

...