手动触发 onChange 事件

Question

我想手动调用我的 onChange。

这是我的 onChange 选择（我将 onChangeSelect 作为来自父组件的道具传递）

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

我想在每次我的变量改变并且为空时调用它

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(',')); }

Answer 1

这里最简单的解决方案是更改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.