snowberb – 10-37 Jun 15

S⛄Snowberb⛄

6/15/2023

Im trying to use AbortController but I cant find out how it really works. If I put it before the fetch, the fetch request gets ignored, it doesnt even start. And if I put it after the fetch, it will simply await the call without aborting. Any ideas?

const controller = new AbortController()

const handleInputChange = async (values) => {
  controller.abort()
  await fetch({values, signal})
}

return <Select onChange={handleInputChange} />

const controller = new AbortController()

const handleInputChange = async (values) => {
  controller.abort()
  await fetch({values, signal})
}

return <Select onChange={handleInputChange} />

Llebouwski

6/15/2023

calling abort will reject the promise what are you trying to do?

S⛄Snowberb⛄

6/15/2023

every time I pick a value on the select I have to make a patch I just want to cancel the previous request if it didnt finish and the user selects a new value

Llebouwski

6/15/2023

const controllerRef = useRef()

const handleInputChange = async (values) => {
  if (controllerRef.current) controllerRef.current.abort();
  controllerRef.current = new AbortController();
  await fetch({values, signal: controllerRef.current.signal })
  controllerRef.current = undefined;
}

return <Select onChange={handleInputChange} />

const controllerRef = useRef()

const handleInputChange = async (values) => {
  if (controllerRef.current) controllerRef.current.abort();
  controllerRef.current = new AbortController();
  await fetch({values, signal: controllerRef.current.signal })
  controllerRef.current = undefined;
}

return <Select onChange={handleInputChange} />

S⛄Snowberb⛄

6/15/2023

why ref?

Llebouwski

6/15/2023

to keep it for when you rerender

S⛄Snowberb⛄

6/15/2023

it works thank you but I dk how I could have thinked of using ref

Llebouwski

6/15/2023

on the second call to handleInputChange you need to call the abort controller for the previous request, so it needs to be kept outside of the function, but created inside

S⛄Snowberb⛄

6/15/2023

okay I get that

UUUnknown User

6/16/2023

Message Not Public

Looking for more? Join the community!

Reactiflux

snowberb – 10-37 Jun 15

Join Server

Reactiflux

snowberb – 10-37 Jun 15

Join Server

Want results from more Discord servers?

Add your server

Recommended Posts

snowberb – 11-51 Jun 14What's preferable and why? This: ```ts const filters: Record<GroupingTypeEnum, InstrumentTypeFilter[I have JSON response as below`{ "data": [ { "id": 3, "attributes": { "industryType": "Food And Beverage SassError: $color: var(--bs-secondary-color) is not a colorGetting this error even though I havent made changes to the sass files. `./node_modules/next/dist/✅ – ✅ – Sourdface – 05-35 Jun 9I have a style/linting question pepega페페가 – 17-01 Jun 6Hi, how can I import javascript files inside of Vite? Can I use the import keyword or I need to imp ⛄Snowberb⛄ – 07-54 Jun 1Does the order of the conditions on an if affect the UI? For example, lets say I have an if with 3 c