Блог

Я новичок, который с трудом разбирается в хуках react.

У меня есть дочерний компонент «RadioButtonsGroup», который использует перехваты (сборка MUI):

 function RadioButtonsGroup() {
  const [value, setValue] = React.useState('isAgent');

  function handleChange(event) {
    setValue(event.target.value);
  }

  return (
    <FormControl component="fieldset">
      <RadioGroup aria-label="Gender" name="gender1" value={value} onChange={handleChange}>
        <FormControlLabel
          value="isAgent"
          control={<Radio color="primary" />}
          label="Agent"
          labelPlacement="start"
        />
        <FormControlLabel
          value="isLandlord"
          control={<Radio color="primary" />}
          label="Landlord"
          labelPlacement="start"
        />
      </RadioGroup>
      <FormHelperText>labelPlacement start</FormHelperText>
    </FormControl>
  );
}
  

Как мне передать реквизиты этому «RadioButtonsGroup.js «от его родительского компонента?
Я пытался использовать

 <RadioButtonsGroup isAgent={false} />
  

Но, похоже, что этот.props.isAgent не передается дочернему компоненту, и этого.props вообще нет.

Функциональный компонент не имеет своих реквизитов this , но вместо этого они props задаются в качестве первого аргумента функции.

 function RadioButtonsGroup(props) {
  const { isAgent } = props;

  // ...
}
  

props передаются как —

 function RadioButtonsGroup(props) {
}
  

или

 const RadioButtonsGroup = props => {
}

export default RadioButtonsGroup;