小编Mar*_*na 的帖子

我正在为信用卡表单创建一个 React 组件库，CreditCardForm.tsx 如下所示：

CreditCardForm.tsx：

import React, {useState} from "react";\n\ninterface CreditCardFormProps {\n  testState: any;\n  name: string;\n  onChangeName: () => void;\n  cardNumber: string;\n  onChangeCardNumber: () => void;\n  expirationDate: string;\n  onChangeExpirationDate: () => void;\n  cvv: string;\n  onChangeCvv: () => void;\n  onSubmit: () => void;\n}\n\n\nconst CreditCardForm = (props: CreditCardFormProps) => {\n  const [testState, setTestState] =useState<any>("hello")\n  return (\n    <form onSubmit={props.onSubmit}>\n      <label htmlFor="name">Name on Card</label>\n      <input\n        type="text"\n        id="name"\n        name="name"\n        value={props.name}\n        onChange={props.onChangeName}\n        required\n        pattern="^[A-Za-z\\s]*$"\n        title="Please input your name correctly"\n      />\n      <p>test: {testState}</p>\n\n      <label htmlFor="cardNumber">Card …