由于没有这样的publicName定义在scope中，因此错误。
您的代码段中存在以下问题：
1.必须在作用域中定义publicName才能访问它。
1.不应该直接在组件中的代码中设置状态。它将导致无限的渲染。最好使用useEffect并在其中设置状态。以便它仅在需要时设置状态。

useEffect(() => {
    fetchAccountId().then((publicName) => setPubname(publicName));
  }, []);

如果您喜欢使用async-await，也可以使用它：

useEffect(() => {
    (async () => {
      const publicName = await fetchAccountId()
      setPubname(publicName);
    })();
  }, []);

CODESANDBOX

import React, { useEffect, useState, Fragment } from "react";

const fetchAccountId = async () => {
  const publicName = "Nancy Moore";
  return publicName;
};

function App() {
  const [accounts] = useState(fetchAccountId);

  const [pubname, setPubname] = useState(null);

  useEffect(() => {
    fetchAccountId().then((publicName) => setPubname(publicName));
  }, []);

  return (
    <div>
      <h2> Display Public Name</h2>

      <div>{pubname}</div>
    </div>
  );
}

export default App;

只需要调整一下，加些零钱

fetchAccountId();

与

const publicName = fetchAccountId();

如果你在useEffect()中使用它会更好。

useEffect(() => {
  const publicName = fetchAccountId();
  setPubname(publicName);
}, []);

此使用效果函数将在组件加载时触发。
注意：fetchAccountId()中的const publicName不是全局变量，它只存在于fetchAccountId()函数中。