例如，如何将字符串形式的已解析承诺对象映射到按钮上

Question

我知道有很多类似的现有问题，但对于我的案例来说，没有一个真的足够简单。

这是我现在的承诺的行为：

至少在第 62 和 63 行，我们可以通过控制台看到正在找到准确和正确的值。我的目标是将其作为值传递给someVar或以其他方式使用更新后的值更新第 70 行。

就目前而言，我的按钮只是呈现Object [Promise]并且在承诺解决后不会改变。

这基本上是我写过的第一个 promise 函数，老实说我很迷茫，尽管其他人的一些详细解释我认为超出了我需要知道的为 api 调用构建一个简单的 promise 的范围。

Answer 1

渲染组件是同步的。如果你想做一些异步的事情，你的组件中需要一个状态变量。在第一次渲染时它将是空的，您可能会渲染一些占位符视图，例如加载微调器。然后你将开始异步的东西，当它完成时你设置状态使其再次呈现。function NewButton({redirectId}){&nbsp; const classes = useStyles();&nbsp; const [someVar, setSomeVar] = useState(null);&nbsp; useEffect(() => {&nbsp; &nbsp; indexSearch(redirectId).then(result => {&nbsp; &nbsp; &nbsp; setSomeVar(result);&nbsp; &nbsp; })&nbsp;&nbsp; }, [])&nbsp; if (!someVar) {&nbsp; &nbsp; return null;&nbsp; }&nbsp; return(&nbsp; &nbsp; &nbsp; <Link as={`/details/${redirectId}`} href={`/details?objectId=${redirectId}`}>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button" className={classes.root}>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {`Learn more about the ${someVar}`}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; &nbsp; </Link>&nbsp; )}