变量不会在获取函数内设置

Question

我试图通过＆＃34; var result＆＃34;将login.php的文本内容打印到屏幕上，但是获取功能不会改变＆＃34; var result＆＃34;的值。如何设置获取函数输出的结果值？

＆＃13;

＆＃13;

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<{}>  {
	render() {
		login();
		return (
			<View style={styles.container}>
				<Logo/>
				<Form/>
				<Text>
					  {result}
				</Text>
				<Text>
				</Text></View>
		);
	}
}

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

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


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

＆＃13;

＆＃13;

＆＃13;

这也不起作用，使用setState：

＆＃13;

＆＃13;

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<{}>  {
	constructor(){
		super();
		this.state = {
			data:'NoData',
		}
	}

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

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

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


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

＆＃13;

＆＃13;

＆＃13;

我是否以错误的方式使用setState？在此先感谢您的帮助。

Answer 1

使用fetch api时，id建议使用promise，

如果需要你解析它然后你设置状态。

React重新渲染状态/道具变化。这是反应101 btw

快速帮助：

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/dynamic_layout"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
     .........
</LinearLayout>

记得在构造函数中设置状态。