S
SolidJS•4w ago
ken_binta

useTransition not working

Hello , I am trying to utilize useTransition but Im not sure if I am doing anything wrong or haven't understood how it works. 
import { createSignal, useTransition } from 'solid-js'

export default function Counter() {
  const [count, setCount] = createSignal(1)
  const [isPending, start] = useTransition()

  const increment = () => {
    start(() => {
      setTimeout(() => {
        setCount((p) => p + 1)
      }, 2000)
    })
  }

  return (
    <>
      <button type="button" onClick={increment}>
        {count()}
      </button>
      <br />

      {isPending() ? 'Yes' : 'No'}
    </>
  )
}
import { createSignal, useTransition } from 'solid-js'

export default function Counter() {
  const [count, setCount] = createSignal(1)
  const [isPending, start] = useTransition()

  const increment = () => {
    start(() => {
      setTimeout(() => {
        setCount((p) => p + 1)
      }, 2000)
    })
  }

  return (
    <>
      <button type="button" onClick={increment}>
        {count()}
      </button>
      <br />

      {isPending() ? 'Yes' : 'No'}
    </>
  )
}
1 Reply
ryansolid
ryansolid•4w ago
Put the setTimeout outside of the start. Transitions track writes tgat happen synchronously, so doing it the way above means the set isn't part of it.

Did you find this page helpful?