手动触发onChange事件

时间:2019-12-08 19:04:19

标签: javascript reactjs

我想手动调用onChange。

这是我通过onChange进行的选择(我通过onChangeSelect作为父组件的道具)

return(
   <Form Control disabled={disabled}
      <NativeSelect ref={ref} onChange={onChangeSelect}>
       ...

每次变量更改且为空时,我都想调用该onChange

useEffect(() => {
    if (requiredSelect[0].length > 0 || id === "root1") { setDisabled(false) }
    else { ref.current.value = ([[], []]); ref.current.onChange ; setDisabled(true); }
}, [requiredSelect])

这是父组件中的onChangeSelect

<Child onChangeSelect={(e) => rootChange(e)}>

及其作用

const rootChange = e => { setRootSelect(e.target.value.split(',')); }

1 个答案:

答案 0 :(得分:0)

这里最简单的解决方案是更改rootChange函数的定义以接受value而不是event本身。

const rootChange = value => { setRootSelect(value.split(',')); }

// In parent:
<Child onChangeSelect={rootChange}>

// Select
<NativeSelect ref={ref} onChange={(e) => onChangeSelect(e.target.value)}>

您可以通过以下方式手动触发功能:

onChangeSelect(whateverValueYouWant); // notice that you need the brackets when calling the function.