Vue.jsで全画面共通でボタンの二重クリックを防止したい

Vue.jsで全画面にボタン二重クリックを防止する機能を実装したいです。

その場合はApp.vueもしくはmain.jsで管理するのでしょうか？
画面の切り替えはApp.vueで行っております。

様々な記事を拝見して同一画面内であればボタンの二重クリック防止はできたのですが1つの画面から全画面をコントロールするやり方が分からないです。

以下の記述で防止？

export default {
  data() {
    return {
      processing: false
    }
  },
  methods: {
    startProcessing: function () {
      this.processing = true
    },
    endProcessing: function () {
      this.processing = false
    },
    isProcessing: function () {
      return this.processing
    }
  }
}

以下の記述を防止したい画面で記述すればいい？

<template>
  <div>
    <button v-bind:disabled="isProcessing()" @click="submit">何かしら処理する</button>
    <p>※押すと2秒間ロックされます</p>
  </div>
</template>

<script>
import Processing from '@/mixin/processing'

export default {
  mixins: [Processing],
  name: 'articleRegister',
  methods: {
    submit: function () {
      this.startProcessing()
      setTimeout(function () {
        this.endProcessing()
      }.bind(this), 2000)
    }
  }
}
</script>