DEV Community

Tr.Ra
Tr.Ra

Posted on

2 2

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

Heroku

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site

Top comments (0)

Heroku

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay