Navigation
Link
The Link component for href, patch and navigate
- Link
- patch
- navigate
Key concepts
Link
is a drop-in replacement for a plain <a>
that
understands the same three navigation modes as HEEx's own <.link>: href,
patch
and navigate. It renders an ordinary anchor and lets
Phoenix's own client-side JavaScript take over the click.
How it works
The first link uses href
— a traditional anchor, a full
browser navigation, no different from clicking a link on a page
with no LiveView on it at all. The second uses navigate
— the browser's URL changes, but the click is intercepted and
handled entirely over the existing socket, mounting a new root
LiveView with no full page reload.
patch
(not shown here, since it only makes sense for the
LiveView that owns the current route — see the Patch vs Navigate
example) works the same way but calls handle_params/3
on the current LiveView instead of mounting a new one.