条纹元素被破坏答案

【问题标题】：Stripe elements getting destroyed条纹元素被破坏
【发布时间】：2023-03-25 03:23:01
【问题描述】：

我有这个 javascript 代码，它用一个 div 动态地创建一个模态，其中条带加载它的元素 div 以保存我的客户卡详细信息。由于它们可以显示和隐藏模态，我决定将一个回调挂钩到模态的隐藏事件中，并将其从 dom 中删除。这意味着每次用户单击按钮以添加新的付款方式时，他都会在 dom 中添加一个新的模式。此外，为了防止在同一页面上出现相同类型的重复条带元素，我销毁了“元素”。第一次尝试一切正常，但每次尝试“销毁”元素后，条纹都会引发异常，说明该元素已被销毁。代码如下：

static createNewPaymentMethod() {
    var stripe = Stripe("My_Publishable_Key");

    var modal = "<DIVS_WITH_THE_MODAL>";

    $("body").append(modal);
    $("#ID_OF_THE_MODAL").modal("show");

    var elements = stripe.elements();
    var stripeCardElement = elements.create('card');

    stripeCardElement.mount('#ID_OF_THE_MODAL .card-element');

    $(document).on("hidden.bs.modal", "#ID_OF_THE_MODAL", function(){
        stripeCardElement.destroy();
        $("#ID_OF_THE_MODAL").remove();
    });
}

我尝试将对变量 stripeCardElement 的调用更改为 elements.getElement('card') 和然后调用 destroy 但与第一次尝试一样，该调用在第一个模态显示后返回 null...

【问题讨论】：

标签： javascript stripe-payments

【解决方案1】：

只是一个快速修复，我将 stripeCardElement.destroy(); 更改为 stripeCardElement.unmount(); 它似乎工作，但我有点认为我编码的方式实际上更好.. 不知道条纹 JS api 内部的方法是否有一些不同..

【讨论】：

我不清楚销毁和卸载之间的区别