Ошибка реагирования при выборе: str.replace не является ошибкой функции - PullRequest
Новая
       25

Ошибка реагирования при выборе: str.replace не является ошибкой функции

0 голосов
/ 03 мая 2019

Я пытаюсь реализовать ответ-выбор в моем проекте.Мой код здесь: https://gist.github.com/BikalNepal/9172b3161abfa545cc5748055c6584c6

Данные для поиска выбираются с использованием graphql и ретрансляции с внутреннего сервера nodejs, когда я печатаю в поле, он выбирает данные правильно, но когда я нажимаю на данные, Я получаю следующие ошибки: 

Option selected: {value: "stark@gmail.com", label: "rickon"}// Selected data is okay
Error:
react-select.esm.js?acac:1224 Uncaught TypeError: str.replace is not a function
    at trimString (react-select.esm.js?acac:1224)
    at Object.eval [as filterOption] (react-select.esm.js?acac:1246)
    at Select.filterOption (react-select.esm.js?acac:3952)
    at toOption (react-select.esm.js?acac:4038)
    at options.reduce.render (react-select.esm.js?acac:4092)
    at Array.reduce (<anonymous>)
    at Select.buildMenuOptions (react-select.esm.js?acac:4071)
    at Select.componentWillReceiveProps (react-select.esm.js?acac:3575)
    at callComponentWillReceiveProps (react-dom.development.js?cada:11395)
    at updateClassInstance (react-dom.development.js?cada:11605)
trimString @ react-select.esm.js?acac:1224
(anonymous) @ react-select.esm.js?acac:1246
filterOption @ react-select.esm.js?acac:3952
toOption @ react-select.esm.js?acac:4038
options.reduce.render @ react-select.esm.js?acac:4092
buildMenuOptions @ react-select.esm.js?acac:4071
componentWillReceiveProps @ react-select.esm.js?acac:3575
callComponentWillReceiveProps @ react-dom.development.js?cada:11395
updateClassInstance @ react-dom.development.js?cada:11605
updateClassComponent @ react-dom.development.js?cada:14648
beginWork @ react-dom.development.js?cada:15598
performUnitOfWork @ react-dom.development.js?cada:19266
workLoop @ react-dom.development.js?cada:19306
callCallback @ react-dom.development.js?cada:149
invokeGuardedCallbackDev @ react-dom.development.js?cada:199
invokeGuardedCallback @ react-dom.development.js?cada:256
replayUnitOfWork @ react-dom.development.js?cada:18532
renderRoot @ react-dom.development.js?cada:19422
performWorkOnRoot @ react-dom.development.js?cada:20296
performWork @ react-dom.development.js?cada:20208
performSyncWork @ react-dom.development.js?cada:20182
interactiveUpdates$1 @ react-dom.development.js?cada:20449
interactiveUpdates @ react-dom.development.js?cada:2170
dispatchInteractiveEvent @ react-dom.development.js?cada:4882
react-dom.development.js?cada:17071 

The above error occurred in the <Select> component:
    in Select (created by StateManager)
    in StateManager (created by CustomerSearch)
    in div (created by FormGroup)
    in FormGroup (created by CustomerSearch)
    in div (created by Col)
    in Col (created by CustomerSearch)
    in div (created by CustomerSearch)
    in CustomerSearch (created by Relay(CustomerSearch))
    in Relay(CustomerSearch) (created by ReactRelayQueryRenderer)
    in ReactRelayQueryRenderer (created by CustomerSearchPage)
    in div (created by CustomerSearchPage)
    in div (created by CustomerSearchPage)
    in CustomerSearchPage (created by ProductPerformance)
    in div (created by Row)
    in Row (created by ProductPerformance)
    in div (created by Container)
    in Container (created by ProductPerformance)
    in div (created by ProductPerformance)
    in ProductPerformance (created by Relay(ProductPerformance))
    in Relay(ProductPerformance) (created by ReactRelayQueryRenderer)
    in ReactRelayQueryRenderer (created by ProductPerformancePage)
    in div (created by ProductPerformancePage)
    in div (created by ProductPerformancePage)
    in ProductPerformancePage (created by Route)
    in Route (created by RoutePage)
    in div (created by RoutePage)
    in Router (created by HashRouter)
    in HashRouter (created by RoutePage)
    in RoutePage (created by App)
    in div (created by App)
    in App

Consider adding an error boundary to your tree to customize error handling behavior.

В чем может быть проблема здесь?

1 Ответ

0 голосов
/ 06 мая 2019

Здесь вы делаете ссылку на event константу, которую вы никогда не объявляете. Ниже ваш код исправлен. Смотрите на реквизитах onInputChange и onKeyDown, вам нужно позвонить event перед отправкой. 

 <Select
   value={selectedOption}
   onChange={this.handleChange}
   options={this.state.options}
   // onKeyDown={event => this.handleRefetch(event)}
   onInputChange={event => this.handleInput(event)}
   inputValue={this.state.value}
 />
...