代码之家 › 专栏 › 技术社区 › Ukasha

异步等待和setTimeout在reactjs中不工作

async-await reactjs javascript

Ukasha · 技术社区 · 7 年前

你可以看到我做了什么 here 是的。

import "babel-polyfill";
import React from "react";
import ReactDOM from "react-dom";

const asyncFunc = () => {
  return new Promise(resolve => {
    setTimeout(resolve("Gotcha!!!"), 10000);
  });
};

class App extends React.Component {
  state = {
    text: "Fetching..."
  };

  componentDidMount = async () => {
    const text = await asyncFunc();
    this.setState({ text });
  };

  render() {
    return <div className="App">{this.state.text}</div>;
  }
}

应用程序应该显示 Fetching... 首先,然后显示 Gotcha!!! 10秒后。但是,它不起作用。我犯了什么错?

3 回复 | 直到 7 年前

CertainPerformance 7 年前

问题是:

setTimeout(resolve("Gotcha!!!"), 10000);

第一个论点 setTimeout 应该是功能 . 现在,你 打电话 resolve 立即 设置超时 尝试(同步)解析其参数相反,传递一个函数然后电话 决定 :

setTimeout(() => resolve("Gotcha!!!"), 10000);

或

setTimeout(resolve, 10000, "Gotcha!!!");

Abdullah 7 年前

你必须通过 setTimeout 回调函数,将其更改为

setTimeout(() => resolve("Gotcha!!!"), 10000);

Farooq Hanif 7 年前

import "babel-polyfill";
import React from "react";
import ReactDOM from "react-dom";

import "./styles.css";

const asyncFunc = () => {
  return new Promise(resolve => {
    setTimeout(() => resolve("Gotcha!!!"), 10000);
  });
};

class App extends React.Component {
  constructor() {
    super();
    this.state = {
      text: "Fetching..."
    };
  }

  componentDidMount = async () => {
    const newText = await asyncFunc();
    this.setState({ text: newText });
  };

  render() {
    return <div className="App">{this.state.text}</div>;
  }
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

推荐文章

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

7 月前

Facundo Cabrera · 意外的应用程序错误!useNavigate()只能在<Router>组件的上下文中使用

7 月前

user29295031 · 如何使用react和vite覆盖Tailwinds css 4默认设计

7 月前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

7 月前

Luckkks · 过渡色工作不正常

7 月前

ModernEraCaveman · 如何对齐我的Bootstrap容器以适应网页的整个宽度?

7 月前

vatsal chauhan · 即使在字体预加载时,文本加载也很慢

7 月前

hasratyan · Next.js 15 API路由-动态路由中的无效GET导出错误[id]

7 月前

noblerare · Vite错误-未定义导出(SSR)

7 月前

ProfessorFinesse · 在默认表单中完成帖子请求时,“res.send”会去哪里?

7 月前