从子组件组合框中反应获取所选值

Question

调用子组件comboBox。

我是React的新手，正在尝试从子组件中保存数据，但在父组件上没有收到此值。我在两个组件上都尝试了使用函数的方法，但是我只是看到了一些使用带有'this。[FUNCTION]'的类的示例，并且在以下代码中我没有使用函数。

<ComboBox
  field='tower_id'
  data={tower_data}                  
  description='Número do bloco'
  onChange={handleClick}
/>

子组件结构。

import React, { useState } from 'react';
import FormHelperText from '@material-ui/core/FormHelperText';
import { makeStyles } from '@material-ui/core/styles';


export default function ComboBox(props) {
  const classes = useStyles();

  function renderOption() {
    return props.data
      ? props.data.map((dataDescription, key) => {
          return <option key={key}>{dataDescription[props.field]}</option>;
        })
      : '';
  }
  const [selectedValue, setSelectedValue] = useState('');
  const handleClick = (e) => setSelectedValue(e.target.value);
  console.log('selectedValue: ', selectedValue);

  return (
    <div className={classes.marginRight} onChange={handleClick}>
      <div>
        <select className={classes.input}>
          <option value=''></option>
          {renderOption()}
        </select>
      </div>
      <FormHelperText>{props.description}</FormHelperText>
    </div>
  );
}

我可以找到选定的值，但是我想在Parent组件上操纵该值，以将所有有效载荷发送到API。有人可以帮忙，并为该代码建议更多的体系结构方法吗？

Answer 1

您应该调用在专业人士onChange={props.handleClick}中发送的函数，因为您没有调用它，所以在父组件中不会收到任何东西