v0.13.0
Breaking Change - Removal of Explicit Binding "Parens" Syntax
The new heuristic for how bindings will be reactive will work as follows:
There are certain types of syntax that will never be reactive like function declarations, literal values.
// these bindings never need to be wrapped
<div onClick={() => setState({clicked: true})} name={"mydiv"} />
Similarly since reactivity requires access only function calls or property accesses can be reactive. So simple variables will never need to be wrapped
// also never needs to be wrapped
<div name={myName} maxlength={count * 2} />
So we can limit wrapping to only expressions that could be reactive like:
// wrap because they could be reactive
<div name={props.name} title={getTitle()} />
Also for Component props that take Components like fallback
or children
we will wrap any expression with a tag to allow deferred evaluation.
// these will be wrapped
<Show when={state.accepted} fallback={<Denied />}>
<Accepted />
</Show>
What if you wish for these things to be static? Hoist the value access. Since normal variables aren't reactive just assign it to a variable. This is JSX so we have all the power of JavaScript at our side and do not need a special syntax.
const name = props.name;
// not wrapped as simple variable
<div name={name} />