score:2

Accepted answer
useeffect(() => {
  if (callfromspace === "blub") {
    setchecked(true);
  }
}, [callfromspace]); // 'checked' should be excluded.

when you update checked it would effect useeffect() eventually setchecked(true) called again...

so, you should exclude checked on the dependency of useeffect().

score:0

the correct way to do it would be put yout async function inside the effect

import react, { useeffect, usestate } from "react";

const asyncfetch = () => "blub";

export default function app() {
  const [checked, setchecked] = usestate(false);
  const [trycheck, settrycheck] = usestate(false);

  useeffect(() => {
    const fetchfromspace = async () => {
        const response = await asyncfetch();
        if (callfromspace === "blub") {
            setchecked(true);
        }
    }
    if(trycheck){
       fetchfromspace();
    }
  }, [trycheck]);

  return (
    <div classname="app">
      <input
        type="checkbox"
        checked={checked}
        onchange={(e) => settrycheck(e.target.checked)}
      />
    </div>
  );
}

score:0

if you need to only do the check once, and have no dependency for it as it seems to be the case, run your useeffect only once and call your async function directly inside of it.

import react, { useeffect, usestate } from "react";

const asyncfetch = async () => "blub"; // this function need to return a promise

export default function app() {
  const [checked, setchecked] = usestate(false);

  useeffect(() => {
    asyncfetch().then(response => {
        if (callfromspace === "blub") {
            setchecked(true); // will update your state as soon as your request returns
        }
    });
  }, []); // no dependency, will only run once

  return (
    <div classname="app">
      <input
        type="checkbox"
        checked={checked}
        onchange={(e) => setchecked(e.target.checked)}
      />
    </div>
  );
}

Related Query

More Query from same tag