Question

我正在努力找出异步等待函数的问题，我不断收到错误说

await是一个保留字

我是新的反应和async函数，我认为问题是我应该在哪里正确地放置await这个函数？

 handleSubmit = async (e) => {

          try {
e.preventDefault();
      this.props.form.validateFieldsAndScroll((err, values) => {
        if (!err && !this.state.added) {
          this.setState({ submit: true });
          await PopUpAdsService.create({
            name: values.name,
            photo: this.state.secureUrl,
            type: values.type,
            link: this.state.deepl,
            status: values.status,
          })

              console.log(response);
              if (response.data.status === 200) {
                Notification(
                  'success',
                  'Pop-up has been created successfully',
                );
                this.setState({ submit: false, added: true });
                setTimeout(() => {
                  this.props.history.replace('/dashboard/pop-up');
                }, 2000);
              }

          } catch (error) {
              console.log(error);
              Notification(
                'error',
                `Oops! Error occured. ${error.response.data.message}`,
              );
              this.setState({ submit: false });
            }

    async handleSubmit(e) {
      try {
    e.preventDefault();
  this.props.form.validateFieldsAndScroll((err, values) => {
        if (!err && !this.state.added) {
          this.setState({ submit: true });
          await PopUpAdsService.create({
            name: values.name,
            photo: this.state.secureUrl,
            type: values.type,
            link: this.state.deepl,
            status: values.status,
          })

          console.log(response);
          if (response.data.status === 200) {
            Notification(
              'success',
              'Pop-up has been created successfully',
            );
            this.setState({ submit: false, added: true });
            setTimeout(() => {
              this.props.history.replace('/dashboard/pop-up');
            }, 2000);
          }

      } catch (error) {
          console.log(error);
          Notification(
            'error',
            `Oops! Error occured. ${error.response.data.message}`,
          );
          this.setState({ submit: false });
        }
   }
      });

    };

Answer 1

*更新代码

如果我们尝试在非异步函数中使用await，那将是语法错误。在你的

this.props.form.validateFieldsAndScroll(err, values) => { ...

这不是async函数，所以你必须这样做：

this.props.form.validateFieldsAndScroll(async (err, values) => { ...

更多信息：https://javascript.info/async-await

handleSubmit = async (e) => {
  try {
    e.preventDefault();
    this.props.form.validateFieldsAndScroll(async (err, values) => {
      if (!err && !this.state.added) {
        this.setState({ submit: true });
        await PopUpAdsService.create({
          name: values.name,
          photo: this.state.secureUrl,
          type: values.type,
          link: this.state.deepl,
          status: values.status,
        })

        console.log(response);

        if (response.data.status === 200) {
          Notification(
            'success',
            'Pop-up has been created successfully',
          );

          this.setState({ submit: false, added: true });
          setTimeout(() => {
            this.props.history.replace('/dashboard/pop-up');
          }, 2000);
        }
      }
    })
  }
  catch (error) {
    console.log(error);
    Notification(
      'error',
      `Oops! Error occured. ${error.response.data.message}`,
    );
    this.setState({ submit: false });
  }
}

React Asyn函数，Await是一个保留字错误

1 个答案: