You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.04.16 06:58:08