React Native + Fetch => TypeError: Kann die Eigenschaft 'then' von undefined nicht lesen

Question

Ich habe ein React Native Projekt mit CRNA eingerichtet und verwende fetch, um Daten von einer API wie dieser zurückzugeben (Schlüssel entfernt, die URL gibt korrekte Daten zurück) zB in Browser mit meinem api-key):

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

ich habe getestet und Konsole protokolliert die Ausgabe der letzten dann Zeile und console.log (news.sources) gibt mir eine korrekte Sicht der 134 Elemente auf einem Array wie ich es erwarten würde.

Dann versuche ich die API in meinen Komponenten componentDidMount Methode zu konsumieren:

state = { news: '' } 

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

, wo ich auf die Fehlermeldung des Titels laufen. Hier ist die vollständige Fehlermeldung in Chrom angezeigt (HINWEIS: Ich finde es ein bisschen seltsam, dass ich zuerst .then Fehler bekomme, aber ich kann deutlich sehen, dass am Ende meiner Fehler-Stack der Abruf erfolgreich war und protokollierte die Ausgabe, die ich in componentDidMount behandelt werden().)

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) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…} 

Answer 1

Sie haben vergessen, eine Rückkehr vor holen in Ihrem getNews funktionieren