2017-11-19 12 views
0

CRANを使用してReactネイティブプロジェクトをセットアップしましたが、このようなAPIからデータを返すためにfetchを使用しています例えば、私のAPIキーとブラウザ)に:React Native + Fetch => TypeError:未定義のプロパティ 'then'を読み取ることができません。

export const getNews =() => { 
    fetch('https://newsapi.org/v2/sources?apiKey=xxx') 
    .then(res => res.json()) 
    .then(news => { 
     console.log(news.sources) 
     return news.sources 
    }) 
} 

アレイ上で私に134項目の正しいビューを与える)私がテストしていると、コンソールは、最後のその行とはconsole.log(news.sourcesの出力をログに記録しました私が期待するように。

state = { news: '' } 

componentDidMount() { 
    NewsAPI.getNews() 
    .then(news => { 
     this.setState({ 
     news 
     }) 
    }) 
} 

私はタイトルのエラーメッセージに実行します。

その後、私は私のコンポーネントでcomponentDidMount方法をAPIを消費してみてください。ここでは、クロムに表示される完全なエラーメッセージです(注:少し奇妙なことがありますが、最初に.thenエラーが発生しますが、エラースタックの最下部にフェッチが成功し、 )(componentDidMountで処理されることを期待する。)

D:\test\node_modules\react-native\Libraries\Core\ExceptionsManager.js:65 TypeError: Cannot read property 'then' of undefined 

This error is located at: 
    in Channel (at SceneView.js:32) 
    in SceneView (at CardStack.js:399) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:398) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:397) 
    in RCTView (at View.js:113) 
    in View (at createAnimatedComponent.js:134) 
    in AnimatedComponent (at Card.js:26) 
    in Card (at PointerEventsContainer.js:55) 
    in Container (at CardStack.js:440) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:370) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:369) 
    in CardStack (at CardStackTransitioner.js:103) 
    in RCTView (at View.js:113) 
    in View (at Transitioner.js:187) 
    in Transitioner (at CardStackTransitioner.js:55) 
    in CardStackTransitioner (at StackNavigator.js:48) 
    in Unknown (at createNavigator.js:48) 
    in Navigator (at createNavigationContainer.js:205) 
    in NavigationContainer (at App.js:8) 
    in App (created by AwakeInDevApp) 
    in RCTView (at View.js:113) 
    in View (created by AwakeInDevApp) 
    in AwakeInDevApp (at registerRootComponent.js:36) 
    in RootErrorBoundary (at registerRootComponent.js:35) 
    in ExpoRootComponent (at renderApplication.js:35) 
    in RCTView (at View.js:113) 
    in View (at AppContainer.js:102) 
    in RCTView (at View.js:113) 
    in View (at AppContainer.js:126) 
    in AppContainer (at renderApplication.js:34) 
MessageQueue.callFunctionReturnFlushedQueue @ D:\test\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:107 
(anonymous) @ debuggerWorker.js:72 
D:\test\node_modules\react-native\Libraries\Core\ExceptionsManager.js:65 TypeError: Cannot read property 'then' of undefined 

This error is located at: 
    in Channel (at SceneView.js:32) 
    in SceneView (at CardStack.js:399) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:398) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:397) 
    in RCTView (at View.js:113) 
    in View (at createAnimatedComponent.js:134) 
    in AnimatedComponent (at Card.js:26) 
    in Card (at PointerEventsContainer.js:55) 
    in Container (at CardStack.js:440) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:370) 
    in RCTView (at View.js:113) 
    in View (at CardStack.js:369) 
    in CardStack (at CardStackTransitioner.js:103) 
    in RCTView (at View.js:113) 
    in View (at Transitioner.js:187) 
    in Transitioner (at CardStackTransitioner.js:55) 
    in CardStackTransitioner (at StackNavigator.js:48) 
    in Unknown (at createNavigator.js:48) 
    in Navigator (at createNavigationContainer.js:205) 
    in NavigationContainer (at App.js:8) 
    in App (created by AwakeInDevApp) 
    in RCTView (at View.js:113) 
    in View (created by AwakeInDevApp) 
    in AwakeInDevApp (at registerRootComponent.js:36) 
    in RootErrorBoundary (at registerRootComponent.js:35) 
    in ExpoRootComponent (at renderApplication.js:35) 
    in RCTView (at View.js:113) 
    in View (at AppContainer.js:102) 
    in RCTView (at View.js:113) 
    in View (at AppContainer.js:126) 
    in AppContainer (at renderApplication.js:34) 
handleException @ D:\test\node_modules\react-native\Libraries\Core\ExceptionsManager.js:65 
handleError @ D:\test\node_modules\react-native\Libraries\Core\InitializeCore.js:106 
reportFatalError @ D:\test\node_modules\react-native\Libraries\polyfills\error-guard.js:46 
__guard @ D:\test\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:271 
MessageQueue.callFunctionReturnFlushedQueue @ D:\test\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:107 
(anonymous) @ debuggerWorker.js:72 

D:\test\src\utils\NewsAPI.js:14 (134) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…} 

答えて

0

あなたはリターンを忘れてしまった前に、あなたのgetNewsにフェッチ

+0

ありがとう機能!あなた自身の仕事に目が見えないように簡単に..実際に暗黙の復帰のために中括弧を削除しました – Sawwy

関連する問題