Reactjs 如何根据单击的单选按钮显示和隐藏文本字段类型编号？

我如何设置一旦点击了paypal的单选按钮，文本字段类型编号就会显示出来，如果没有点击，它就会保持隐藏状态

此外，单击COD后，将显示一条消息，如“选择COD作为付款选项”

const page=（）=>{
const[payment，setPayment]=useState（）；
返回(
选择付款选项
setPayment（例如target.value）}
/>
货到付款（货到付款）


setPayment（例如target.value）}
/>{" "}
Gcash
下单

在jsx中插入以下内容：

{ 
  payment === "paypal" && 
    <TextField
      id="gcash-num"
      label="paypal"
      type="number"
      fullWidth
    /> 
}

{
  payment === "cod" &&
    <p>cod is chosen for the payment option</p>
}

{
付款==“贝宝”&
}
{
付款==“cod”&&
选择cod作为付款选项

const page = () => {
      const [payment, setPayment] = useState();
      return (
        <div>
          <Container fixed>
                <form onSubmit={handleSubmit}>
                  <Typography align="left" variant="subtitle1" color="secondary">
                    Choose Payment Option
                  </Typography>
                  <input
                    type="radio"
                    value="cod"
                    name="paymentMethod"
                    onChange={(e) => setPayment(e.target.value)}
                  />
                  COD(Cash-on-Delivery)<br></br>
                  <input
                    type="radio"
                    value="paypal"
                    name="paymentMethod"
                    onChange={(e) => setPayment(e.target.value)}
                  />{" "}
                  Gcash
                  <TextField
                    id="gcash-num"
                    label="paypal"
                    type="number"
                    fullWidth
                  />
                    <Button type="submit">Place an Order</Button>
   

}