Javascript React Stripe JS：如何向表单添加边框样式？

我正在使用

react stripe js

并正在设计卡片元素的样式。我在将边框样式添加到我创建的样式时遇到问题。我的CheckoutForm中有下面的代码，例如，我尝试添加彩色边框。我得到的不是任何边界，而是无边界输入

CheckoutForm.js

const元素\u选项={
iconStyle：“实体”，
hidePostalCode:true，
风格：{
基数：{
边框：“2px纯红”//尝试过这个**************************
iconColor:“rgb（240、57、122）”，
颜色：“rgb（240、57、122）”，
字体大小：“16px”，
fontFamily:“'开放式SAN'，无衬线'，
字体平滑：“抗锯齿”，
“：：占位符”：{
颜色：“CFD7DF”
}
},
无效：{
颜色：“e5424d”，
“：焦点”：{
颜色：“303238”
}
}
}
};
...
卡号
卡到期
CVC
储蓄卡

您不想将其作为（内部）元素样式的一部分添加，而是想直接为

s设置样式，就像您对任何其他元素一样。

无需使用sirve para nada el ejempo

const ELEMENT_OPTIONS = {
  iconStyle: "solid",
  hidePostalCode: true,
  style: {
    base: {
      border: '2px solid red',//TRIED THIS**************************
      iconColor: "rgb(240, 57, 122)",
      color: "rgb(240, 57, 122)",
      fontSize: "16px",
      fontFamily: '"Open Sans", sans-serif',
      fontSmoothing: "antialiased",
      "::placeholder": {
        color: "#CFD7DF"
      }
    },
    invalid: {
      color: "#e5424d",
      ":focus": {
        color: "#303238"
      }
    }
  }
};
...

<form onSubmit={this.SaveCard}>
          <div className="split-form">
            <label htmlFor="cardNumber">Card Number</label>
            <CardNumberElement
              id="cardNumber"
              options={ELEMENT_OPTIONS}
            />
            <label htmlFor="expiry">Card Expiration</label>
            <CardExpiryElement
              id="expiry"
              options={ELEMENT_OPTIONS}
            />
          </div>
          <div className="split-form">
            <label htmlFor="cvc">CVC</label>
            <CardCvcElement
              id="cvc"
              options={ELEMENT_OPTIONS}
            />
          </div>
          <button type="submit" disabled={!stripe}>
            Save Card
          </button>
        </form>