This is the code I'm using. Its also in sevelte5 playground here.What I don't understand is, why it's not logging when I add todo with array.push but works when I do reassignment. However, when I uncomment commented lines in $effect body, it works for both. Just curios if I understand $effect correctly here.
<script> let todos = $state([{ text: "Todo 1", status: "pending" }]); $effect(() => { console.log(todos) // const countEl = document.getElementById("count"); // countEl.innerHTML = todos.length }); function pushTodo(event) { if (event.key != 'Enter')return const elem = event.target todos.push({text: elem.value, status: "pending"}) elem.value = "" } function spreadTodo(event) { if (event.key != 'Enter')return const elem = event.target todos = [...todos, {text: elem.value, status: "pending"}] elem.value = "" }</script><div class="todos"><input onkeyup={pushTodo} placeholder="Push Todo"><input onkeyup={spreadTodo} placeholder="Spread Todo"><ul> {#each todos as todo}<li> {todo.text}: {todo.status}</li> {/each}</ul><p>Total: <span id="count"></span></p></div>