副作用

约 190 字小于 1 分钟

2026-09-20

默认的副作用函数会在组件被挂载的时候执行一次, 之后每次组件更新都会执行一次, 也就是在组件的生命周期中, 副作用函数会在 onMounted 时执行.

如果副作用函数返回一个函数, 那么这个返回的函数会在组件卸载的时候执行, 也就是在组件的生命周期中, 返回的函数会在 onUnmounted 时执行.

<script>
  $effect(() => {
    console.log('副作用, onMounted');

    return ()=>{
      console.log('副作用, onUnmounted');
    }
  });
</script>

当然 $effect 也可以用来监听变量的变化, 当变量发生变化时, 副作用函数会被执行.

<script>
  let count = $state(0);

  $effect(() => {
    console.log('副作用, count:', count);
  });
</script>