在React中没有使用ES6获取来定义获取方法

嘿家伙我有我的第一个反应js应用程序中获取函数的麻烦。

这是我的项目的结构：

hello-world -- app -- components -- main.jsx -- node_modules -- public -- build.js -- index.html -- package.json 

这是我用npm安装的：

 npm install react react-dom babel-core babel-loader babel-preset-es2015 babel-preset-react webpack --save-dev npm install --save isomorphic-fetch es6-promise 

我使用webpack webpack.config

 module.exports = { entry: './app/components/main.jsx', output: { path: './public/', filename: "build.js", }, module: { loaders: [ { exclude: /(node_modules|bower_components)/, loader: 'babel', query: { presets: ['es2015', 'react'] } } ] } }; 

的package.json

 { "name": "hello-world", "version": "1.0.0", "description": "", "main": "webpack.config.js", "scripts": { "build": "webpack -w" }, "author": "mannuk", "license": "MIT", "devDependencies": { "babel-core": "^6.14.0", "babel-loader": "^6.2.5", "babel-preset-es2015": "^6.14.0", "babel-preset-react": "^6.11.1", "react": "^0.14.8", "react-dom": "^0.14.8", "webpack": "^1.13.2" }, "dependencies": { "es6-promise": "^3.3.1", "isomorphic-fetch": "^2.2.1" } } 

这是我build立用户界面的文件：

main.jsx

 import React from 'react'; import ReactDOM from 'react-dom'; import 'isomorphic-fetch'; import 'es6-promise'; class Person extends React.Component { constructor(props){ super(props); this.state = {people : []}; } componentWillMount(){ fetch('xxx/people', method: 'get', headers: {'token' : 'xxx'} ) .then((response) => { return response.json() }) .then((people) => { this.setState({ people: people }) }) } render(){ return <div> <input type="text" value={this.state.people[0].name}></input> </div> } } ReactDOM.render( <Person/>, document.getElementById('container') ); 

如果我试图通过浏览器运行它失败（取得方法没有定义）我也检查了这个相关的postES6`fetch是未定义的 ，我已经包括导入没有成功。 我也包括es6-承诺import，但也失败了。

我究竟做错了什么？ 这是configuration问题还是什么？ 当我运行“npm run build”时，没有错误，build.js似乎没问题。

Answer 1

这是导出的默认值，所以…

 import fetch from 'isomorphic-fetch' 

Answer 2

为此添加一个polyfill是正确的方法。 看看我最近的一个项目，你只需要做以下的导入;

 import promise from 'es6-promise'; import 'isomorphic-fetch'; promise.polyfill(); 

它看起来像你还没有得到正确的es6-promise导入，需要调用.polyfill（）方法。 我build议把这些放在应用程序的入口点，因为你只需要导入它们一次。

我也build议你包括babel polyfill;

 import 'babel-polyfill';