1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465 |
- import React, { Component } from "react";
- import { View, Text, StyleSheet, Platform } from "react-native";
- import Header from "./header";
- import Footer from "./footer";
- const styles = StyleSheet.create({
- container: {
- flex: 1,
- backgroundColor: "#F5F5F5",
- ...Platform.select({
- ios: {
- paddingTop: 30
- }
- })
- },
- content: {
- flex: 1
- }
- });
- class App extends Component {
- constructor(props) {
- super(props);
- this.state = {
- value: "",
- items: []
- };
- this.handleAddItem = this.handleAddItem.bind(this);
- }
- handleAddItem() {
- if (!this.state.value) {
- return;
- }
- const newItems = [
- ...this.state.items,
- {
- key: Date.now(),
- text: this.state.value,
- complete: false
- }
- ];
- this.setState({
- items: newItems,
- value: ""
- });
- }
- render() {
- console.log(this.state);
- return (
- <View style={styles.container}>
- <Header
- onAddItem={this.handleAddItem}
- onChange={(value) => this.setState({ value })}
- value={this.state.value}
- />
- <View style={styles.content} />
- <Footer />
- </View>
- );
- }
- }
- export default App;
|