The main issue is that jsx can contain both mutable references to a variable and immutable references. For example <div onClick={() => count = count + 1}>{count}</div> contains both a mutable reference to count and an immutable reference. Thus, the naive way of storing this in a single struct will fail. The use of the elm architecture (where the onClick handler returns a message, instead of directly updating count) side steps the complicated borrow-checker issues.
It is certainly possible to get around this with the proper procedural macro, but it is not easy, and will never be as "magic-free" as people want.
Comments
The main issue is that jsx can contain both mutable references to a variable and immutable references. For example <div onClick={() => count = count + 1}>{count}</div> contains both a mutable reference to count and an immutable reference. Thus, the naive way of storing this in a single struct will fail. The use of the elm architecture (where the onClick handler returns a message, instead of directly updating count) side steps the complicated borrow-checker issues.
It is certainly possible to get around this with the proper procedural macro, but it is not easy, and will never be as "magic-free" as people want.