Vue.js BootstrapVue Prevent Button Double Click (Disable) and Show Loading on Click

<template>  <b-form inline class="justify-content-center" ref="form" @submit.prevent="submit">    <b-form-group label="Email" label-sr-only label-for="input-email">      <b-input          v-model="email"          id="input-email"          placeholder="Your email"        ></b-input>      <b-button type="submit" variant="primary" :disabled="loading"><b-spinner small v-if="loading"></b-spinner> Request Invite</b-button>    </b-form-group>  </b-form></template><script>export default {  data() {    return {      email: null,      loading: false    }  },  methods: {    submit() {      this.loading = true      // do something      this.loading = false    }  }}</script>