onChange未为自定义子组件触发

我有一个定制的组件,名为 Autocomplete 它本质上是一个文本输入框,除其他外,它在输入时获取用户输入。它有一个 onChange

class Autocomplete extends Component {
    constructor(props) {
        super(props);
        this.state = {
            activeSuggestion: 0,
            filteredSuggestions: [],
            showSuggestions: false,
            userInput: ""
        };
    }

    //Lifted function to reset autocomplete for Reset button
    handleReset = () => {
        this.setState({
            userInput: ""
        });
    };

    //Begin Autocomplete functionality
    onChange = e => {
        const { suggestions } = this.props;
        const userInput = e.currentTarget.value;
        const filteredSuggestions = suggestions.filter(
            suggestion =>
                suggestion.toLowerCase().indexOf(userInput.toLowerCase()) > -1
        );
        this.setState({
            activeSuggestion: 0,
            filteredSuggestions,
            showSuggestions: true,
            userInput: e.currentTarget.value
        });
    };
     ....

我在父窗体组件中使用此组件,如下所示:

<Autocomplete ref={autoCompleteRef} suggestions={affiliationData}
    onChange={myChangeHandler}/>

我正试图将userInput的值提升到我的钩子中。我最初尝试使用 useRef

function AddContactForm() {
  const [name, setName] = useState();
  const [title, setTitle] = useState();
  const [current, setCurrent] = useState();
  const [email, setEmail] = useState();
  const [phone, setPhone] = useState();
  const [county, setCounty] = useState();
  const [affiliation, setAffiliation] = useState();
  const [centralRegionLead, setCentralRegionLead] = useState("True");

  const myChangeHandler = (event) => {
    let nam = event.target.name;
    let val = event.target.value;
    if (nam === 'name') {
      setName(val);
    } else if (nam === 'title') {
      setTitle(val);
    } else if (nam === 'current') {
      setCurrent(val);
    } else if (nam === 'email') {
      setEmail(val);
    } else if (nam === 'phone') {
      setPhone(val);
    } else if (nam === 'county') {
      setCounty(val);
    } else if (nam === 'autocomplete') {
      const { state } = autoCompleteRef.current;
      setAffiliation(state.userInput);
    } else if (nam === 'centralRegionLead') {
      setCentralRegionLead(val);
    }
  }

我做错了什么?