未处理的拒绝（语法错误）：输入意外结束[重复]

Question

我正在制作一个专用于电子邮件订阅者的组件...喜欢这个

import React from "react";

class SubscribeOffer extends React.Component {
constructor () {
    super();
    this.state={
        email: ""
    }
}

fillEmailToSubscribe = (event) => {
    this.setState({email: event.target.value});
}

submitEmailToSubscribe = () => {
    if (this.state.email > 3) {
        fetch('https://(myuser).list-manage.com/subscribe/post?u=(somenumber)&id=(myid)'
        ,{
            mode: 'no-cors',
            method:'POST',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({
                email:this.state.email
            })
        })
        .then(response => response.json())
        .then(() => {
            alert('Thank you for subscribing!');
        })
    }

}

render () {
    return (
        <div>
            <h1>Get updated upcoming events in your inbox everyday!</h1>
            <p>Would you like us to give you updates with future updates upcoming events?</p>
            <input 
                type='email'
                name='email-address'
                id='email-address'
                placeholder="your email" 
                onChange={this.fillEmailToSubscribe}
                required
            />
            <button onClick={this.submitEmailToSubscribe}>Subscribe</button>
        </div>
    )
}
}

export default SubscribeOffer;

然而，我只得到这样的回应

Unhandled Rejection (SyntaxError): Unexpected end of input

你知道我如何解决这个问题吗？我让它变得像人们输入他们的电子邮件一样简单，只需单击按钮，就这样。

非常感谢您的任何帮助！

Answer 1

由于您的电子邮件是构造函数中定义的字符串，并且您将该电子邮件与数字进行比较将是您的第一个错误。

因此，您可以使用如下内容从“submitEmailToSubscribe”函数更新if循环：

if(this.state.email.trim() !== '') {
  fetch('https://(myuser).list-manage.com/subscribe/post?u=(somenumber)&id=(myid)'
    ,{
        mode: 'no-cors',
        method:'POST',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({
            email:this.state.email
        })
    })
    .then(() => alert('Thank you for subscribing!'));
}

Answer 2

您得到的错误是因为，它发送了空响应(例如，将响应作为空对象{})，因为您试图获取json()。这是因为cors。

尝试将** 'Access-Control-Allow-Origin'：'*' ** 添加到标头和模式中，作为 'cors'。您需要先从 API 获取响应。