DEV Community

Tr.Ra
Tr.Ra

Posted on

react: sync data of useState between parent and child component

parent:

const Parent = () => {
    const [text, setText] = useState('')

    const input = (value) => {
        setText(value)
    }

    return (
        <View style={styles.contianer}>
            <Child input={input} />
            <Text style={{padding: 10, fontSize: 42}}>
            {text}
            </Text>

        </View>
    )
}
Enter fullscreen mode Exit fullscreen mode

child:

const Child = (params) => {
    const [storage, setValue] = useLocalStorage({});
    const [text, setText] = useState('')
    const handleOnChange = (text) => {
        setText(text)
        params.input(text)
    }

    return(
        <View style={styles.seacrbar} >
            <FontAwesomeIcon style={styles.searchIcon} icon={ faSearch } />
            <TextInput 
            style={styles.input} 
            placeholderTextColor="#3f4652"  
            placeholder="Search Coin Pairs"
            onChangeText={handleOnChange}
            />
        </View>
    )
}
Enter fullscreen mode Exit fullscreen mode

Top comments (0)