Skip to content

wire:replace

Laravel Livewire Documentation Reference

Since Magewire is heavily inspired by Laravel Livewire, many concepts are either identical or very similar. To avoid duplicating documentation, this page only covers Magewire-specific and platform-specific details. For all general concepts and in-depth explanations, you can refer to the corresponding Laravel Livewire documentation.

Livewire Reference

wire:replace tells Magewire to replace an element's children instead of morphing them individually:

<div wire:replace>
    <?= $block->getChildHtml('third-party-widget') ?>
</div>

Use it when preserving intermediate DOM nodes would leave a widget or browser-managed subtree in an invalid state. The .self modifier replaces the element itself rather than only its contents.

Replacement discards browser state, focus, event listeners, and third-party instances below the replaced boundary. Prefer normal morphing for forms and interactive controls unless complete replacement is intentional; use wire:ignore when the browser widget, rather than the server render, should retain ownership.