Can a component have some local state that is passed down to children? Or any data has to be in a proxy object that is outside of any components?
In the following example, each of the three 'things' has its own votes state:
function drawThing(title) {
const votes = proxy({up: 0, down: 0});
$('h1:'+title);
$('button:', () => votes.up++);
$('button:', () => votes.down++);
$(() => {
// Do this in a new reactive scope, so changes to votes won't rerun drawThing,
// which would reset votes.
$(`:${votes.up} up, and ${votes.down} down`);
// Of course, we could also call `drawVotes(votes)` instead here.
})
}
onEach(['One', 'Two', 'Three'], drawThing);