Accudio / async-alpine

Async Alpine brings advanced code splitting and lazy-loading to Alpine.js components!
https://async-alpine.dev
Apache License 2.0
152 stars 12 forks source link

Does not support the `@click` interaction pattern #10

Closed Accudio closed 2 years ago

Accudio commented 2 years ago

@ is not a valid character within a HTML attribute name, therefore when we try and rename ax-@click back to @click we get the below error.

Uncaught DOMException: Failed to execute 'setAttribute' on 'Element': 'ax-@click' is not a valid attribute name.

I can't think of any way around this and restore @click directly, but we could transform into the x-on: pattern in order to preserve functionality. For example:

<!-- source html -->
<div @resize.window="">

<!-- after Async Alpine inits and before component enabled -->
<div ax-@resize.window="">
<!-- OR -->
<div ax-x-on:resize.window="">

<!-- after component initialisation -->
<div x-on:resize.window="">
Accudio commented 2 years ago

Added in 0.3.0