v0.2.1 - createState
The createState
function manages state changes to DOM nodes. Here's an example of a counter:
import { createElement, createState } from 'transform-jsx'
const Counter = () => {
let [count, setCount] = createState(0)
return (
<div>
<button onClick={() => setCount(count().value as number - 1)}>-</button>
<span id={count().key}>{count().value}</span>
<button onClick={() => setCount(count().value as number + 1)}>+</button>
</div>
)
}
A unique key
is generated and attached to the id
. This id
is referenced by setCount
when making a state change. If a state change is made and the value is not attached to a DOM element then an error is thrown.
TL;DR: createState
is one massive sugar function. Instead of doing
const element = document.getElementById('some-random-id');
element.innerText = 'some value';
We're using the familiar getter setter value pattern/paradigm.
Also added support for JSS.
Full Changelog: v0.1.1...v0.2.1