Laravel 9，惯性，如何关闭模态答案

【问题标题】：Laravel 9, inertia, how to close modalLaravel 9，惯性，如何关闭模态
【发布时间】：2022-12-21 12:24:37
【问题描述】：

methods: {
        async getPaymentLink() {
          //get link function here.....

          if(data.link_page_url) {
            this.$inertia.get(data.link_page_url);
          }

        },
    }

此代码默认在模态窗口中打开 url。问题是如何在同一代码部分或以其他方式关闭此窗口？

【问题讨论】：

标签： laravel vue.js inertiajs

【解决方案1】：

要在同一代码段中关闭模态窗口，可以使用模态组件提供的关闭函数。例如：

if(data.link_page_url) {
  this.$inertia.get(data.link_page_url);
  this.$modal.close();
}

或者，您也可以通过调用模态实例本身的 close 函数来关闭模态窗口。例如：

const modal = this.$modal.open({
  component: MyModalComponent
});
modal.close();

请记住，您需要引用模态实例才能关闭它。

如果你想从不同的代码部分关闭模态窗口，你可以使用 $emit 方法来触发一个事件，该事件可以被打开模态的组件监听。例如：

// In the component that opened the modal:
methods: {
  closeModal() {
    this.$modal.close();
  }
}

// In the component that wants to close the modal:
this.$emit('close-modal');

然后，您可以在打开模态的组件中监听 close-modal 事件，并在事件发出时关闭模态：

// In the component that opened the modal:
created() {
  this.$on('close-modal', this.closeModal);
},
methods: {
  closeModal() {
    this.$modal.close();
  }
}

【讨论】：