Deprecation: w‐* Attributes

w-id → key

The w-id attribute is deprecated in favor of the key attribute.

<div w-id="foo"/>

…becomes:

<div key="foo"/>

w-for → for:scoped

The w-for attribute is deprecated in favor of using the standard for attribute with Marko’s :scoped modifier.

<label w-for="name">Name</label>
<input w-id="name"/>

…becomes:

<label for:scoped="name">Name</label>
<input id:scoped="name"/>

The id attribute is also modified with :scoped and the same attribute value, so Marko knows to keep them in sync.

widget.elId → :scoped

The *=widget.elId("someId") syntax is deprecated in favor of the :scoped modifier.

You can use :scoped on any attribute to reference a scoped value (internally, the key Marko uses). This value will be unique to this component instance.

<button aria-describedby=widget.elId("tooltip")>Hack the planet</button>
<small w-id="tooltip" role="tooltip">May not actually hack the planet</small>

…becomes:

<button aria-describedby:scoped="tooltip">Hack the planet</button>
<small id:scoped="tooltip" role="tooltip">May not actually hack the planet</small>

This pattern is useful for other attributes that reference identifiers, like fragment links, aria-labelledby, and usemap.

w-preserve → no-update

The w-preserve attribute is deprecated in favor of the no-update attribute.

<div w-preserve>

…becomes:

<div no-update>

w-preserve-attrs → :no-update

The w-preserve-attrs attribute is deprecated in favor of the :no-update attribute modifier.

<div class="foo" w-preserve-attrs="class">

…becomes:

<div class:no-update="foo">

w-on-* → on-*()

The w-on-* attribute is deprecated in favor of on-*() event handler attributes. The new syntax also supports binding additional arguments.

<button w-on-click="handleClick">Do the thing</button>
<!-- or -->
<button w-onClick="handleClick">Do the thing</button>

…become:

<button on-click('handleClick')>Do the thing</button>