[英]React App fetch data using Node Fetch
I am using the Create-React-App starter app to play around with react. 我正在使用Create-React-App入门应用程序来解决问题。 I want to test getting data with node fetch, but it does not seem to work.
我想测试使用节点获取来获取数据,但它似乎不起作用。 I am able to get it to work with axios.
我能够让它与axios一起工作。
I get an error to the effect that: Warning in ./~/encoding/lib/iconv-loader.js Critical dependencies: 9:12-34 the request of dependency is an expression @ ./~/encoding/lib/iconv-loader.js 9:12-34 我得到的错误是:./~/encoding/lib/iconv-loader.js中的警告关键依赖关系:9:12-34依赖的请求是表达式@ ./~/encoding/lib/iconv- loader.js 9:12-34
it seems to be an error in webpack:///./~/react-scripts/~/react-dev-utils/webpackHotDevClient.js? 它在webpack中似乎是一个错误:///./~/react-scripts/~/react-dev-utils/webpackHotDevClient.js?
I also get an error that says: Failed to load resource: net::ERR_CONNECTION_TIMED_OUT and it seem like the fetch is appending the port to the url when sending the request: http://codepen.io:3000/jobs.json 我还得到一个错误:无法加载资源:net :: ERR_CONNECTION_TIMED_OUT,看起来fetch在发送请求时将端口附加到url: http ://codepen.io:3000 / jobs.json
Code: 码:
import React from 'react'
import NodeFetch from 'node-fetch'
class NodeFetchData extends React.Component {
constructor(props) {
super(props);
this.state = {
jobs: []
};
}
componentDidMount() {
NodeFetch('http://codepen.io/jobs.json')
.then(res => {
this.setState({ jobs:res.data.jobs });
});
}
render() {
return (
<div>
<ul>
{this.state.jobs.map(job =>
<li key={job.hashid}>{job.company_name}</li>
)}
</ul>
</div>
);
}
}
export default NodeFetchData;
I suggest you use https://github.com/github/fetch , that is pretty standard, in fact this has been recently added as peer in react@15.4 ). 我建议你使用https://github.com/github/fetch ,这是非常标准的,事实上这最近被添加为react @15.4中的peer。
For more sophisticated cases ( like multiple file-uploads etc ) superagent
goes good! 对于更复杂的案例(如多个文件上传等),
superagent
变得更好!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.