2017-02-09 59 views
0

我不认为这需要一个绑定来查看响应,但我必须失去一些东西,因为即时通讯从该Fetch/post获取响应。这是我的抓取。反应 - 我看不到我的回应

export default class Test extends Component { 
constructor(props) { 
super(props); 
this.state = { value: '' }; 

this.handleChange = this.handleChange.bind(this); 
this.handleSubmit = this.handleSubmit.bind(this); 
} 
componentDidMount() { } 

handleChange(event) { 
this.setState({ value: event.target.value }); 
} 

handleSubmit(event, cb) { 
    event.preventDefault(); 

return (
    fetch('test/post', 'POST') 
    .then(response => { 
     if (response.status >= 400) { 
     this.setState({ 
      value: 'error', 
     }); 
     throw new Error('Throw Error'); 
     } 
     console.log('REACT::RESPONSE', response.json()); 
     return response.json(); 
    }) 
    .then(cb) 
    .catch(() => { 
     this.setState({ 
     value: 'error cb', 
     }); 
    }) 
); 
    } 

该帖子看起来不错。它击中了我的webApi,我得到了回应。我使用fiddler来查看我的开发工作站上的http流量。以下是来自我的webApi的响应消息在小提琴手中的样子。

HTTP/1.1 200 OK 
Date: Wed, 08 Feb 2017 22:49:27 GMT 
Content-Type: application/json; charset=utf-8 
Server: Kestrel 
Access-Control-Allow-Origin: * 
Content-Length: 16 

{"name":"MyName"} 

当前MYRESPONSE ::控制台日志只显示。

MYRESPONSE::[object Promise] 

或 “MYRESPONSE ::” + JSON.stringify(响应)表示

MYRESPONSE::{} 
+0

你如何使用'handleSubmit'函数? – Khang

+0

@Khang这是一个基本的表单提交。

Puerto

回答

1

.json()返回一个承诺。你需要做.json().then(data => console.log(data))

+0

是的,就是这样。非常感谢。接受和upvoted。 – Puerto

相关问题