Revised by
Michael Peter
6e4ef7c
| import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF'
},
header : { fontWeight: 'bold', fontSize: 20 },
text : {padding : 40}
});
export default class LoremIpsumScreen extends Component {
constructor(props) {
super(props);
this.state = {
text: 'Loading...'
};
}
async componentDidMount() {
await delay(3000);
let newTextResponse = await fetch('https://loripsum.net/api/1/short/plaintext');
let newText = await newTextResponse.text();
this.setState({ text: newText });
}
render() {
return (
<View style={styles.container}>
<Text style={styles.header}>MOBILE VERSION</Text>
<Text style={styles.text}>{this.state.text}</Text>
</View>
);
}
}
// helper function to insert delays in async functions
function delay(ms) {
return new Promise(resolve => {
setTimeout(() => {
resolve();
}, ms);
});
}
|