react-native counter

크리스·2021년 12월 11일

//react-native counter

import React, { useState, useEffect } from 'react';
import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';

const PlusButton = ({ _onPress }) => {
return (


+


);
};

const MinusButton = ({ _onPress }) => {
return (


-


);
};

const Counter = ({ count, setCount }) => {
const minus = () => setCount(count - 1);
const plus = () => setCount(count + 1);
return (
<View style={{ flexDirection: 'row' }}>

<Text style={[styles.count_text, {}]}>{count}


);
};

export default function App() {
const [count, setCount] = useState(0);

useEffect(() => {}, []);

return (



);
}

const styles = StyleSheet.create({
contianer: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
round_button: {
width: 50,
height: 50,
borderRadius: 30,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: 'green',
},
button_text_color_white: {
color: 'white',
fontWeight: 'bold',
fontSize: 20,
},
count_text: {
alignSelf: 'center',
fontSize: 30,
marginHorizontal: 20,
color: 'black',
},
});

0개의 댓글