Svelte, Malina.js

bindings.md

Svelte	Malina.js	Shortcut / Comment
Reference to element
bind:this={ref}	#ref
1-way binding
prop={prop}	prop={prop}
{prop}	{prop}
2-way binding
bind:value={value}	bind:value={value}	:value={value} / :value:value
bind:value	bind:value	:value
Class/Style
class:name={value}	class:name={value}
class:name	class:name
-	style:name={value}	set style, like class binding
-	style:name	-//-
Actions
use:action	use:action	*action
use:action={param}	use:action={param}	*action={param}
-	use={$element.focus()}	*{$element.focus()} Run some js-code on element, inline action
Events
on:event={handler}	on:event={handler}	@event:handler
on:event={() => handler(5)}	on:event={() => handler(5)}	@event={handler(5)}
emit event
import { createEventDispatcher } from 'svelte'; let emit=createEventDispatcher(); emit('message', 'Hello!')	$emit('message', 'Hello!')