'how can I passing data between the sibling component in React.js [duplicate]

I have search box that store a search value in state , also I want to send this value to anthore component that is sibling with nav-bar .how can I do that ? this is my code

1-part one

const Nav = () => {
const [searched,setSearched] = useState();
return (
    <div className={style.main}>
        <input className={style.search} type="text" value={searched} onChange={(event)=>{setSearched(event.target.value)}} />
    </div>
);}

2-part two : sibling component

const Now_Weather = () => {
const [weather,setWeather] = useState({null})

useEffect(()=>{
    const setapi =async()=>{
        const data = await (current_name()); //I need to pass "searched" from nav-bar to here
        setWeather(data); //set resault of current_name() in waether.

    }
    setapi();
},[weather])

there is on solution use Context-api but I don't want to implement that.

Do you know another ways ?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source