简短的回答是：不要这样滥用$ref，最终，它只会导致反模式被反模式所包裹。
与您要完成的确切任务相关的更详细的答案：我现在已经在一些Vue项目上处理了这个完全相同的事情（全局的，基于承诺的确认对话框），这是到目前为止工作得非常好的：
1.将确认对话框设置为它自己的独立“模块”，这样您就可以使用两行将其添加到main.js中：

import ConfirmModule from './modules/confirm';
Vue.use(ConfirmModule);

(side要点：还有其他一些“全局模块化组件”，如警报等...）
1.使用JS文件可以编排设置流程、承诺管理和组件示例化。例如：

import vuetify from '@/plugins/vuetify';
import confirmDialog from './confirm-dialog.vue';

export default {
  install(Vue) {
    const $confirm = (title, text, options) => {
      const promise = new Promise((resolve, reject) => {
        try {
          let dlg = true;
          const props = {
            title, text, options, dlg,
          };
          const on = { };
          const comp = new Vue({
            vuetify,
            render: (h) => h(confirmDialog, { props, on }),
          });
          on.confirmed = (val) => {
            dlg = false;
            resolve(val);
            window.setTimeout(() => comp.$destroy(), 100);
          };

          comp.$mount();
          document.getElementById('app').appendChild(comp.$el);
        } catch (err) {
          reject(err);
        }
      });
      return promise;
    };

    Vue.prototype.$confirm = $confirm;
  },
};

1.将其挂载到Vue.prototype，这样您就可以在应用的任何组件中使用它，只需调用：this.$confirm(...)
1.当你构建你的Vue组件（confirm-dialog.vue）时，你只需要单向绑定标题、文本和选项的属性，单向绑定对话框的dlg属性，或者通过getter和setter的计算属性设置一个双向绑定......无论哪种方式......
1.如果用户确认，则使用true发出“confirmed”事件。因此，从confirm-dialog.vue组件：this.$emit('confirmed', true);
1.如果他们关闭对话框，或者点击“否”，那么就会发出false，这样承诺就不会一直存在：this.$emit('confirmed', false);
1.现在，您可以从任何组件中使用它，如下所示：

methods: {
  confirmTheThing() {
    this.$confirm('Do the thing', 'Are you really sure?', { color: 'red' })
      .then(confirmed => {
        if (confirmed) {
          console.log('Well OK then!');
        } else {
          console.log('Eh, maybe next time...');
        }
      });
  }
}

在nuxt项目的默认布局中，放置组件，例如Confirm，如下所示：

<v-main>
      <v-container fluid>
        <nuxt />
        <Confirm ref="confirm" />
      </v-container>
    </v-main>

然后可以使用组件的open方法，如下所示：

const confirmed = await this.$root.$children[2].$refs.confirm.open(...)
if (!confirmed) {
  return // user cancelled, stop here
}
// user confirmed, proceed

棘手的事情是如何找到包含在布局中的组件。$root.$children[2]部分似乎在开发阶段工作，但一旦部署，它必须是$root.$children[1]。
所以我最后做了下面的事情：

// assume default.vue has data called 'COPYRIGHT_TEXT'
  const child = this.$root.$children.find(x => x.COPYRIGHT_TEXT)
  if (child) {
    const confirm = child.$refs.confirm
    if (confirm) {
      return await confirm.open(...)
    }
  }
  return false

背景：我的项目正在生产中，但是在以特定模式进行任何保存之前，我提出了一个新的要求，即在保存之前获得确认。我可以使用单向event bus，但是要做到这一点，确认之后的其余代码必须重构，以便在每个保存位置作为回调传递。

**[31 Oct 22]**同时，项目迁移到组合API，最后使用store的getter/setter共享Confirm组件的ref，以避免使用上述查找ref的黑客方法：

// default.vue stores a ref
store.setRefGetConfirm(confirm)

// anywhere it needs to confirm
const confirmed = await store.refGetConfirm.open()