CheckBox 개별 클릭

react-native-community/checkbox 컴포넌트로 개별클릭 될 수 있게 코드 구현하기.

import React, {useState, useEffect, useCallback} from 'react';
import CheckBox from '@react-native-community/checkbox';

export const Test = () = > {

	const initialState = {
    	terms: false,
        personal: false,
        simple: false,
    }
    
    const [isSelected, setIsSelected] = useState(initialState);
    
	return (
    	<View>
        	<View style={styles.checkView}>
            	<CheckBox
                	disabled={false}
                    value={isSelected.terms}
                    onValueChange={value => {
                    	setIsSelected({
                        	...isSelected,
                            terms: value,
                         });
                    }
                    style={styles.checkbox}
                />
                <Text>이용약관</Text>
            </View>
            <View style={styles.checkView}>
            	<CheckBox
                	disabled={false}
                    value={isSelected.personal}
                    onValueChange={value => {
                    	setIsSelected({
                        	...isSelected,
                            personal: value,
                         });
                    }
                    style={styles.checkbox}
                />
                <Text>개인정보처리방침</Text>
            </View>
            <View style={styles.checkView}>
            	<CheckBox
                	disabled={false}
                    value={isSelected.simple}
                    onValueChange={value => {
                    	setIsSelected({
                        	...isSelected,
                            simple: value,
                         });
                    }
                    style={styles.checkbox}
                />
                <Text>간편주소이용동의</Text>
            </View>
        </View>
    );
};

const styles = StyleSheet.create({
	checkView: {
    	flexDirection: 'row',
        alignItems: 'center',
    },
    checkbox: {
    	alignSelf: 'center',
    },
})

이런식으로 구현할 수 있다.