Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/451.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/21.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 反应选择错误:str.replace不是函数错误_Javascript_Reactjs_React Select_Relayjs - Fatal编程技术网

Javascript 反应选择错误:str.replace不是函数错误

Javascript 反应选择错误:str.replace不是函数错误,javascript,reactjs,react-select,relayjs,Javascript,Reactjs,React Select,Relayjs,我正在尝试在我的项目中实现react select。 我的代码在这里: 正在使用graphql和relay从后端nodejs服务器获取搜索数据,当我在框中键入时,它会正确地获取数据,但当我单击数据时,会出现以下错误: Option selected: {value: "stark@gmail.com", label: "rickon"}// Selected data is okay Error: react-select.esm.js?acac:1224 Uncaught TypeError:

我正在尝试在我的项目中实现react select。 我的代码在这里:

正在使用graphql和relay从后端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.
所选选项:{value:stark@gmail.com,标签:“rickon”}//所选数据正常 错误: react select.esm.js?acac:1224未捕获类型错误:str.replace不是函数 在trimString(react select.esm.js?acac:1224) 在Object.eval[作为过滤器选项](react select.esm.js?acac:1246) 在Select.filter选项(react Select.esm.js?acac:3952) 在t选项处(react select.esm.js?acac:4038) 在options.reduce.render(react select.esm.js?acac:4092) 在Array.reduce()处 在Select.buildMenuOptions(react Select.esm.js?acac:4071) 在Select.component将接收道具(react Select.esm.js?acac:3575) 在callComponentWillReceiveProps(react dom.development.js?cada:11395) 在updateClassInstance(react dom.development.js?cada:11605) trimString@react select.esm.js?acac:1224 (匿名)@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 PerformWorkRoot@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 组件中发生了上述错误: 在选择中(由StateManager创建) 在StateManager中(由CustomerSearch创建) 在div中(由FormGroup创建) 在FormGroup中(由CustomerSearch创建) 在div中(由Col创建) 列中(由CustomerSearch创建) 在div中(由CustomerSearch创建) 在CustomerSearch中(由中继(CustomerSearch)创建) 继电器中(CustomerSearch)(由ReactRelayQueryRenderer创建) 在ReactRelayQueryRenderer中(由CustomerSearchPage创建) 在div中(由CustomerSearchPage创建) 在div中(由CustomerSearchPage创建) 在CustomerSearchPage中(由ProductPerformance创建) 在div中(按行创建) 在行中(由ProductPerformance创建) 在div中(由容器创建) 容器中(由ProductPerformance创建) 在div中(由ProductPerformance创建) 在ProductPerformance中(由Relay(ProductPerformance)创建) 继电器内部(产品性能)(由ReactRelayQueryRenderer创建) 在ReactRelayQueryRenderer中(由ProductPerformancePage创建) 在div中(由ProductPerformancePage创建) 在div中(由ProductPerformancePage创建) 在ProductPerformancePage中(按路线创建) 路由内(由RoutePage创建) 在div中(由RoutePage创建) 路由器中(由HashRouter创建) 在HashRouter中(由RoutePage创建) 在RoutePage中(由应用程序创建) 在div中(由应用程序创建) 应用程序内 考虑将错误边界添加到树中以自定义错误处理行为。
这里可能有什么问题?

这里您引用了一个从未声明的
事件
常量。下面的代码已修复。请参见道具上的
onInputChange
onKeyDown
在发送事件之前,您必须调用事件

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

您是否检查了发生错误时的
选项
状态?