wire:confirm
Livewireで危険な操作を実行する前に、ユーザーに何らかの視覚的な確認を提供したい場合があります。Before performing dangerous actions in Livewire, you may want to provide your users with some sort of visual confirmation.
Livewireでは、アクション (wire:click、wire:submitなど) に加えて wire:confirm を追加することで、これを簡単に行うことができます。Livewire makes this easy to do by adding wire:confirm in addition to any action (wire:click, wire:submit, etc.).
以下は、「Delete post」ボタンに確認ダイアログを追加する例です。Here's an example of adding a confirmation dialog to a "Delete post" button:
<button
type="button"
wire:click="delete"
wire:confirm="Are you sure you want to delete this post?"
>
Delete post <!-- [tl! highlight:-2,1] -->
</button>
ユーザーが「Delete post」をクリックすると、Livewireは確認ダイアログ（デフォルトのブラウザ確認アラート）をトリガーします。ユーザーがEscapeキーを押すか、キャンセルを押すと、アクションは実行されません。「OK」を押すと、アクションが完了します。When a user clicks "Delete post", Livewire will trigger a confirmation dialog (The default browser confirmation alert). If the user hits escape or presses cancel, the action won't be performed. If they press "OK", the action will be completed.
ユーザーに入力を求めるPrompting users for input
ユーザーのアカウントを完全に削除するなどの、さらに危険な操作の場合、特定の一連の文字を入力してアクションを確認する必要がある確認プロンプトを表示したい場合があります。For even more dangerous actions such as deleting a user's account entirely, you may want to present them with a confirmation prompt which they would need to type in a specific string of characters to confirm the action.
Livewireは、便利な .prompt 修飾子を提供します。これは wire:confirm に適用されると、ユーザーに入力を求め、入力が指定された文字列（wire:confirm 値の最後に "|" (パイプ) 文字で指定）と一致する場合にのみアクションを確認します。Livewire provides a helpful .prompt modifier, that when applied to wire:confirm, it will prompt the user for input and only confirm the action if the input matches (case-sensitive) the provided string (designated by a "|" (pipe) character at the end if the wire:confirm value):
<button
type="button"
wire:click="delete"
wire:confirm.prompt="Are you sure?\n\nType DELETE to confirm|DELETE"
>
Delete account <!-- [tl! highlight:-2,1] -->
</button>
ユーザーが「Delete account」を押すと、「DELETE」がプロンプトに入力された場合にのみアクションが実行され、それ以外の場合はアクションがキャンセルされます。When a user presses "Delete account", the action will only be performed if "DELETE" is entered into the prompt, otherwise, the action will be cancelled.