📄️ d-attrs
The d-attrs directive in DOMY allows you to dynamically set multiple HTML attributes on an element using a JavaScript object.
📄️ d-component
The d-component directive in DOMY allows you to dynamically render a custom component based on a provided name and transfer all the attributes and children to it.
📄️ d-for
The d-for directive in DOMY allows you to loop over arrays or objects to dynamically render elements based on the collection. It acts like a for loop in JavaScript.
📄️ d-html
The d-html directive in DOMY.js dynamically sets the innerHTML of an element based on a reactive expression. This allows you to inject raw HTML content directly into an element when the evaluated expression changes.
📄️ d-if
The d-if directive in DOMY allows you to conditionally render an element in the DOM based on a JavaScript expression. It functions similarly to an if statement in JavaScript.
📄️ d-ignore
If you don't want DOMY to render a specific HTML element.
📄️ d-insert
The d-insert directive in DOMY allows you to replace a `` element with a dynamically created DOM element. It is reactive, so whenever the expression changes, the inserted element updates accordingly.
📄️ d-model
The d-model directive in DOMY provides two-way data binding for form elements such as `, , and `.
📄️ d-mounted
The d-mounted directive in DOMY allows you to run JavaScript code or a function once the element and all its children are fully mounted in the DOM. This is especially useful when you need to access references (d-ref) or ensure that the layout is complete before executing logic.
📄️ d-name
The d-name directive in DOMY allows you to assign a name to an element, enabling components to easily reference it using $names.
📄️ d-once
The d-once directive in DOMY allows you to render an element only once, even if its reactive dependencies change later. This is useful when you want to optimize rendering for static content that doesn’t need to update after the initial render.
📄️ d-ref
The d-ref directive in DOMY allows you to assign a reference name to an element so you can easily access it later via the $refs object in your component or scope.
📄️ d-scope
The d-scope directive in DOMY allows you to create a reactive data object that is scoped to the current DOM element and its children. This scoped reactivity means variables defined here will only be available within the specific subtree.
📄️ d-setup
The d-setup directive in DOMY allows you to execute JavaScript code or a function when an element is initialized by DOMY for the first time.
📄️ d-show
The d-show directive in DOMY allows you to conditionally display an element by toggling its display style rather than removing it from the DOM.
📄️ d-teleport
The d-teleport directive allows you to move template content to a specific location in the DOM. This is particularly useful for elements like modals that need to be rendered at the top level of the document.
📄️ d-text
The d-text directive allows dynamic text content updates in an element. It is particularly useful when using a templating language like Mustache.js, which also utilizes {{ expression }} syntax.
📄️ d-transition
The d-transition directive allows you to define a transition name for an element, making it easy to animate components when they appear and disappear. It works seamlessly with directives such as d-show, d-if, d-else-if, d-else, and d-insert.
📄️ d-unmount
The d-unmount directive allows the execution of JavaScript logic when an element is unmounted. This is useful for cleanup tasks such as removing event listeners, canceling network requests, or executing specific functions when an element is removed from the DOM.