I am new to ReactJS, I am trying to use city_name variable in another module and not able to find, please help me with this
import { useState } from "react";
const SearchCity = (props) => {
const { type = "text", placeHolder = "scarch...", name,} = props;
const [city_name, setCityName] = useState("");
return (
<div className="flex border-2 border-gray-200 rounded">
<input
class="px-4 py-2 w-80 text-black take-input"
type={type}
name={name}
placeholder={placeHolder}
onChange={(e) => setCityName(e.target.value)}
/>
<button
className="px-4 text-white bg-gray-600 border-l">
Search...
</button>
</div>
);
};
export default SearchCity;
Just send city_name as prop and destructure it.
suppose you have one component <Home/> and you have to pass city_name in home component.
// here sending data as prop
<Home city_name = {city_name}/>
// Recive data
const home = ({city_name}) => {
<div>
</div>
}