dy / templize

Template parts for DOM elements

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Prop-ize? attrz? propx? attrx?

dy opened this issue · comments

Simplified take from templize and alpine/lit/etc.
:if, :else-if, :else, :each are special directives with special formatting, excluding moustache wrappers.
We can mix it with standard lit/alpine/vue approach for dynamic properties, since it allows to safely dynamize html elements without templating-related errors. It's just sort of data- attributes, but evaluated to templates.

So by default :prop="x=1" evaluates to [predefined] element property.
Any property outside of props is handled as directive: :if, :each.

Events with modifiers @click.prevent... are pretty cool too, but create confusing convention. I guess they must point to specific code that gets executed, @click.prevent.throttle="someAPICall(event.xyz)".
Same time props can safely take :onclick="(e)=>{...}".
To make events more useful, they can have a meaning addEventListener, so that multiple attributes attach listeners, not assign events. Nope: <x @click @click></x> is considered one attribute.