Как рассчитать силы, которые будут применяться к игроку в отдельных createEffect, которые сбрасываются при каждом обновлении

Question

У меня есть счетчик, который я хочу накопить, добавив к нему несколько чисел. При каждом обновлении сбрасывается на 0. Я хотел эти обновления разделить на отдельные . Но это не работает. Как мне изменить свою логику, чтобы плеер шел плавно и останавливался в нужный момент. О, я не упомянул, что это для расчета приложенных сил в физической системе. Поэтому я обнулил силы после этого. Таким образом, счетчик представляет собой результирующую силу, которую необходимо приложить.

      import { render } from "solid-js/web";
import { on, createSignal, createEffect } from "solid-js";

function Counter() {
  const [update, setUpdate] = createSignal(0);
  const addUpdate = () => setUpdate(update() + 1);

  const [count, setCount] = createSignal(0);

  createEffect(on(update, dt => {
    setCount(0)
  }))

  createEffect(on(update, dt => {
    if (dt % 10 < 3) {
      setCount(_ => _ + 3)
    }
  }))

  createEffect(on(update, dt => {
    if (dt % 10 < 9) {
     setCount(_ => _ + 1)
    }
  }))

// Expected output: `0 4, 1 4, 2 4, 3 1, 4 1, 5 1, 6 1, 7 1, 8 1, 9 1, 10 4, 11 4, 12 4, 13 1`
createEffect(on(update, () => {
  console.log([update(), count()].join(' '))
}))

setInterval(() => {
 addUpdate()
}, 500)

  return (
    <button type="button">
      {count()}
    </button>
  );
}

render(() => <Counter />, document.getElementById("app"));

Answer 1

Трудно понять, чего вы пытаетесь достичь, глядя на свой код.

Эффект запускается при каждом обновлении состояния. Таким образом, вы можете смотреть счетчик и соответственно чистить интервал.

      import { createEffect, createSignal, on } from "solid-js";
import { render } from "solid-js/web";

function Counter() {
  const [count, setCount] = createSignal(0);
  const [collecteds, setCollecteds] = createSignal([]);

  const int = setInterval(() => setCount(c => c + 1), 500);

  createEffect(() => {
    if (count() === 5) {
      clearInterval(int);
    }
  });
  
  // This tracks `count` only, so that you can update
  // collecteds without triggering an infinite loop
  createEffect(on(count, () => {
    setCollecteds([...collecteds(), count()]);
  }));

  return (
    <div>{count()} {JSON.stringify(collecteds())}</div>
  );
}

render(Counter, document.getElementById("app"));