是否可以从 async/await [任何解决方案] 中分散两个值

Question

所以我一直在以不同的方式玩弄承诺在这里我试图了解如何以不同的方式实现承诺和 async/await 我遇到了困难我想做的是将这段代码（有效的代码）转移到这个 async/await 中，它很乱而且对我不起作用 [请原谅我的英语和我的代码编写]

完美运行

React.useEffect(() => {
    if (!pokemonName) {
      return
    }
    setPokemon(null);
    setError(null)
    fetchPokemon(pokemonName).then(
      pokemon => setPokemon(pokemon),
      error => setError(error),
    )
  }, [pokemonName])

没用

React.useEffect(() => {
            if (!pokemonName) {
              return
            }
            setPokemon(null)
            setError(null)
            async function effect() {
              const [result,error] = await fetchPokemon(pokemonName);
              if(error){
                return setError(error);
              }else{
                return setPokemon(result);
              }
            }
            effect()
          }, [pokemonName])

Answer 1

您可以将第一个片段转换为

React.useEffect(async () => {
    if (!pokemonName) {
      return
    }
    setPokemon(null);
    setError(null)
    try {
      setPokemon(await fetchPokemon(pokemonName));
    } catch (error) {
      setError(error);
    }
  }, [pokemonName])

使用 await 的异步函数调用不会 return 出错。它抛出错误。因此，您必须捕获潜在的错误。如果函数不能 async 你可以使用立即调用的函数表达式 (IIFE)

React.useEffect(() => {
    if (!pokemonName) {
      return
    }
    setPokemon(null);
    setError(null)
    (async () => {
      try {
        setPokemon(await fetchPokemon(pokemonName));
      } catch (error) {
        setError(error);
      }
    })();
  }, [pokemonName])

是否可以从 async/await [任何解决方案] 中分散两个值

is it possible to distruct two values from async/await [any solution]

javascript

promise

async-await

reactjs