Variable wird nicht innerhalb der Abruffunktion

Question

eingestellt wird Ich versuche, Textinhalt login.php in den Bildschirm über „var Ergebnis“ zu drucken, aber die Funktion holt nicht Wert von „var result“ ändern. Wie kann ich den Wert des Ergebnisses aus der Ausgabe der Fetch-Funktion setzen?

import React, { Component } from 'react'; 
 
import { 
 
    StyleSheet, 
 
    Text, 
 
    View, 
 
    StatusBar, 
 
} from 'react-native'; 
 

 
import Logo from '../components/Logo'; 
 
import Form from '../components/Form'; 
 
import loginapi from '../apis/loginapi'; 
 

 
var result='noresult'; 
 

 
export default class Login extends Component<{}> { 
 
\t render() { 
 
\t \t login(); 
 
\t \t return (
 
\t \t \t <View style={styles.container}> 
 
\t \t \t \t <Logo/> 
 
\t \t \t \t <Form/> 
 
\t \t \t \t <Text> 
 
\t \t \t \t \t {result} 
 
\t \t \t \t </Text> 
 
\t \t \t \t <Text> 
 
\t \t \t \t </Text></View> 
 
\t \t); 
 
\t } 
 
} 
 

 
function login() { 
 
\t \t result = fetch('https://www.skateandstrike.com/loginsv/login.php').then((text) => {return text;}); 
 
\t } 
 

 
const styles = StyleSheet.create({ 
 
    container : { 
 
    backgroundColor:'#f05545', 
 
    flex: 1, 
 
    alignItems:'center', 
 
    justifyContent:'center', 
 
    } 
 
}); 
 

 

 
function myFunction() { 
 
    
 
this.setState({ showLoading: false }); 
 
}

Dies wird nicht zu arbeiten, mit setState:

import React, { Component } from 'react'; 
 
import { 
 
    StyleSheet, 
 
    Text, 
 
    View, 
 
    StatusBar, 
 
} from 'react-native'; 
 

 
import Logo from '../components/Logo'; 
 
import Form from '../components/Form'; 
 
import loginapi from '../apis/loginapi'; 
 

 
export default class Login extends Component<{}> { 
 
\t constructor(){ 
 
\t \t super(); 
 
\t \t this.state = { 
 
\t \t \t data:'NoData', 
 
\t \t } 
 
\t } 
 

 
\t render() { 
 
\t \t login(); 
 
\t \t return (
 
\t \t \t <View style={styles.container}> 
 
\t \t \t \t <Logo/> 
 
\t \t \t \t <Form/> 
 
\t \t \t \t \t <Text> 
 
\t \t \t \t \t \t {this.state.data} 
 
\t \t \t \t \t </Text> 
 
\t \t \t </View> 
 
\t \t); 
 
\t } 
 
} 
 

 
function login() { 
 
\t \t fetch('https://www.skateandstrike.com/loginsv/login.php').then(data => this.setState(data)); 
 
\t } 
 

 
const styles = StyleSheet.create({ 
 
    container : { 
 
    backgroundColor:'#f05545', 
 
    flex: 1, 
 
    alignItems:'center', 
 
    justifyContent:'center', 
 
    } 
 
}); 
 

 

 
function myFunction() { 
 
    
 
this.setState({ showLoading: false }); 
 
}

Bin ich setState in einer falschen Weise verwenden? Vielen Dank im Voraus für Ihre Hilfe.

Answer 1

Wenn die api holen verwenden, empfehlen id ein Versprechen mit,

Sie es analysieren, wenn nötig, dann setzen Sie Zustand.

Reagieren Wieder macht auf Zustand/Requisiten ändern. Das ist 101

schnelle Hilfe btw reagieren:

fetch (url) 
.then(data => data.json()) if needed 
.then(data => this.setState(data)) 

erinnern Zustand in den Konstruktor zu setzen.