付款方式删除后重新加载Braintree插入UI

Question

When I perform, this.gateway.paymentMethod.delete(response.paymentMethod.token); , is there any way to reload the Drop-In UI to explicitly show the user that their payment method has been deleted? In other words, the payment method is removed from the list of payment methods within the Drop-In UI.

Answer 1

_{Full disclosure: I work at Braintree. If you have any further questions, feel free to contact support .}

You can reload the Drop-in UI by using the teardown method on the Drop-in instance, followed by a subsequent braintree.dropin.create() call. The teardown method will cleanly remove everything setup by a dropin.create call. You can use the method similarly to this:

instance.teardown(function (teardownErr) {
  if (teardownErr) {
    console.error('Could not tear down Drop-in UI!');
  } else {
    console.info('Drop-in UI has been torn down!');
  }
});

Once the Drop-in is torn down, you can then call braintree.dropin.create() again to setup the Drop-in to display the customer's accurate stored payment methods.

While slightly different implementation, there is an example of the teardown method in this tutorial .

UPDATE: A newer version of the Drop-in UI was just released that allows customers to delete their payment methods from within the Drop-in. You can use this by upgrading to the latest version of the Drop-in (v1.12.0) .

Once you've upgraded, set vaultManager to true within your braintree.dropin.create() call, similar to this:

braintree.dropin.create({
  authorization: 'CLIENT_AUTHORIZATION',
  container: '#dropin-container',
  vaultManager: true
}, callback);