Vue:mount()中的代码是否同步运行?

时间:2019-04-25 01:43:44

标签: vue.js

我有Vue组件,而我的Vue组件之一是Square付款表单。在我的mounted()中,我拥有所有的Square逻辑,并将表单制作为paymentForm 创建付款后,我需要运行paymentForm.build()。不使用setTimeout怎么办?

mounted() {

      this.paymentForm = new SqPaymentForm({
              // Initialize the payment form elements
            autoBuild: false,
            applicationId: applicationId,
            locationId: locationId,
            inputClass: 'form-control',

            // Customize the CSS for SqPaymentForm iframe elements
            inputStyles: [{
                fontSize: '14px',
            }],

            // Initialize the credit card placeholders
            cardNumber: {
                elementId: 'sqCardNumber',
                placeholder: 'Card Number'
            },
            cvv: {
                elementId: 'sqCvCode',
                placeholder: 'CVV'
            },
            expirationDate: {
                elementId: 'sqExp',
                placeholder: 'MM/YY'
            },
            postalCode: {
                elementId: 'sqPostalCode',
                placeholder: 'Postal Code'
            },
      // SqPaymentForm callback functions
      callbacks: {
        methodsSupported: function (methods) {},

        createPaymentRequest: function () {},

        cardNonceResponseReceived: function(errors, nonce, cardData) {
            debugger

            if (errors) {
                cardNonceError(errors);
                return;
            }

            cardNonceReceived(nonce);
        },

        unsupportedBrowserDetected: function() {
            alert('Sorry, your browser is not supported!');
        },
        inputEventReceived: function(inputEvent) {
            switch (inputEvent.eventType) {
                case 'focusClassAdded':
                    // HANDLE AS DESIRED
                    break;
                case 'focusClassRemoved':
                    // HANDLE AS DESIRED
                    break;
                case 'errorClassAdded':
                    // HANDLE AS DESIRED
                    break;
                case 'errorClassRemoved':
                    // HANDLE AS DESIRED
                    break;
                case 'cardBrandChanged':
                    // HANDLE AS DESIRED
                    break;
                case 'postalCodeChanged':
                    // HANDLE AS DESIRED
                    break;
            }
        },

       paymentFormLoaded: function() {

           paymentForm.setPostalCode(postalCode);

           formDisplayHandler();
       }
      }
    });

    // setTimeout(() => {
        this.paymentForm.build()

    // }, 500);
}

0 个答案:

没有答案