reactjs - 受控单选按钮 - React，React-Bootstrap

Question

我将 React 与 React-Bootstrap 一起使用。

如果选中，我想通过给它们一个选中的道具来控制单选按钮。

我正在寻找解决方案，我认为它应该是这样的属性，但“this”并不是指按钮值。

checked={this.value === formData.priceLevel} 

export default function HandleForm() {
  const [formData, setFormData] = useState({
    location: '',
    coordinates: {
      latitude: 0,
      longitude: 0,
    },
    radius: 5,
    priceLevel: '',
  });

  const handleInputChange = (event) => {
    const { name, value } = event.currentTarget;
    setFormData((prev) => ({ ...prev, [name]: value }));
  };
  return (
    <Container fluid>
      <Form>
        <Form.Group>
              <Button
                aria-label="low-level price"
                onClick={handleInputChange}
                name="priceLevel"
                value="low-price"
                checked={this.value === formData.priceLevel} 
                /*
                this.value doesn't refer to button value, how could I make checked true when 
                checked
                */
              >
              <Button
                aria-label="high-level price"
                onClick={handleInputChange}
                name="priceLevel"
                value="high-price"
                checked={this.value === formData.priceLevel}
              >
        </Form.Group>
      </Form>
    </Container>

)};

感谢您的帮助，对我的问题或代码的任何反馈都会有所帮助。