在Square Connect中提交表单后如何重置信用卡表单

Question

在Square Connect中，我正在使用sqPaymentForm创建信用卡即刻。提交表单并创建Nonce后，我想重置表单/清除所有  文本框。我正在使用Angular 7，而FormGroup不适用于sqPaymentForm。那么如何在“提交”表单上重置我的表单？

this.paymentForm = new SqPaymentForm({

        // Initialize the payment form elements
        applicationId: this.applicationId,
        locationId: this.locationId,
        autoBuild: false,
        inputClass: 'sq-input',
        // Initialize the credit card placeholders
        cardNumber: {
          elementId: 'sq-card-number',
          placeholder: 'Valid Card Number'
        },
        cvv: {
          elementId: 'sq-cvv',
          placeholder: 'CVV'
        },
        expirationDate: {
          elementId: 'sq-expiration-date',
          placeholder: 'Expiration'
        },
        postalCode: {
          elementId: 'sq-postal-code',
          placeholder: 'Zip Code'
        },
        // SqPaymentForm callback functions
        callbacks: {
          /*
           * callback function: methodsSupported
           * Triggered when: the page is loaded.
           */

          /*
           * callback function: cardNonceResponseReceived
           * Triggered when: SqPaymentForm completes a card nonce request
           */
          cardNonceResponseReceived: (errors, nonce, cardData) => {
            if (errors) {
              // Log errors from nonce generation to the Javascript console
              console.log("Encountered errors:");
              errors.forEach(function (error) {
                console.log('  ' + error.message);
              });
              return;
            }

            this.updateCustomerCard(nonce, cardData.billing_postal_code);
          },

          /*
           * callback function: paymentFormLoaded
           * Triggered when: SqPaymentForm is fully loaded
           */
          paymentFormLoaded: function () {
            /* HANDLE AS DESIRED */
          }
        }
      });

      this.paymentForm.build();
    }

Answer 1

无法直接编辑任何字段，因此您将无法一次重置一个字段。但是，您确实可以调用付款表上的destroy()，然后调用build()来重建表单（这实际上将重置所有字段）。