单击背景时如何防止laravel jetstream模式关闭？

Posted 2023-03-07

【中文标题】单击背景时如何防止laravel jetstream模式关闭？

【英文标题】：How to prevent laravel jetstream modal to close when clicking on the background?

【发布时间】：2021-11-02 06:10:53

【问题描述】：

我想让jetstream modal static .. 仅在通过取消按钮完成点击时才关闭。

---

在引导中我可以做到这一点

$('#myModal').modal(
backdrop: 'static',
keyboard: false
)

【问题讨论】：

对于这类问题，通常还需要提供一个基本代码块来重现您的问题。

【参考方案1】：

我找到的解决方案是在发布 jetstream 组件后删除模态组件中的x-on:click 事件。

改变这个

<div x-show="show" class="fixed inset-0 transform transition-all" x-on:click="show = false" x-transition:enter="ease-out duration-300"
                    x-transition:enter-start="opacity-0"
                    x-transition:enter-end="opacity-100"
                    x-transition:leave="ease-in duration-200"
                    x-transition:leave-start="opacity-100"
                    x-transition:leave-end="opacity-0">
        <div class="absolute inset-0 bg-gray-500 opacity-75"></div>
    </div>

到

<div x-show="show" class="fixed inset-0 transform transition-all"  x-transition:enter="ease-out duration-300"
                    x-transition:enter-start="opacity-0"
                    x-transition:enter-end="opacity-100"
                    x-transition:leave="ease-in duration-200"
                    x-transition:leave-start="opacity-100"
                    x-transition:leave-end="opacity-0">
        <div class="absolute inset-0 bg-gray-500 opacity-75"></div>
    </div>