'How to pass components value into a function in an another component
Given two components, I need to pass in a parameter to a function in component A (Home) from component B (Filters)
export default function Filters({filter}) {
return (
<>
<CarType filter={() => filter()} type="Campervan" desc="Obytka s rozměry osobáku, se kterou dojedete všude." />
<CarType type="Integrál" desc="Král mezi karavany. Luxus na kolech." />
<CarType type="Vestavba" desc="Celý byt geniálně poskládaný do dodávky." />
<CarType type="Přívěs" desc="Tažný karavan za vaše auto. Od kapkovitých až po rodinné." />
</>
)
}
const Home = () => {
const [data, setData] = useState(Data.items)
const filterItem = (type) => {
const newData = Data.items.filter((newItem) => {
return newItem.vehicleType === type
})
setData(newData)
}
return (
<>
<Filters filter={() => filterItem()}/>
</>
)
}
I need to pass in a different parameter, depending on the CarType (button) I click.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
