js__react_native__fb/App04Blink.js

45 lines
892 B
JavaScript

import React from "react";
import {
Text,
View,
} from 'react-native';
import styles from "./styles";
class Blink extends React.Component {
constructor(props) {
super(props);
this.state = { isShowingText: true };
setInterval(() => {
this.setState(previousState => ({
isShowingText: !previousState.isShowingText,
}));
}, 1000);
}
render() {
const display = this.state.isShowingText
? this.props.text
: ' ';
return (
<Text>{display}</Text>
);
}
}
export default class BlinkApp extends React.Component {
render() {
return (
<View style={styles.container}>
<Blink text="I love to blink" />
<Blink text="Yes blinking is so great" />
<Blink text="Why did they ever take this out of HTML" />
<Blink text="Look at me look at me look at me" />
</View>
);
}
}