Svelte 5中$effect Rune调用array.push操作$state Rune数组时不触发日志的疑问
Svelte 5中$effect Rune调用array.push操作$state Rune数组时不触发日志的疑问
嘿,各位Svelte开发者们,我最近在折腾Svelte 5的runes特性,遇到了一个让我摸不着头脑的问题,想过来请教大家:
我写了一段处理待办事项的代码,用$state声明了一个数组来存储待办项,核心代码大概是这样的:
<script> let todos = $state([]); function addTodo() { // 用push添加时,$effect里的日志不触发 todos.push({ text: '新待办' }); // 换成重新赋值的方式,日志就能正常触发 // todos = [...todos, { text: '新待办' }]; } $effect(() => { console.log('待办项更新了:', todos); // 要是解开下面这行注释,push操作也会触发日志 // console.log(todos.length); }); </script> <button on:click={addTodo}>添加待办</button>
现在遇到的情况是:
- 当我用
array.push的方式添加新待办项时,$effect里的日志完全没有反应; - 但如果改用数组重新赋值的方式,日志就正常打印了;
- 更奇怪的是,要是我把
$effect函数体里注释掉的那行代码解开,不管是用push还是重新赋值,日志都能正常跑起来。
我实在搞不懂这背后的逻辑:为什么push这种数组的原地修改操作,默认不会触发$effect的重新执行?而解开$effect里的注释代码后,两种方式又都能生效了呢?有没有大佬能帮忙解释下这其中的原理呀?
备注:内容来源于stack exchange,提问作者Rahul
相关产品推荐
相关产品推荐

