3👍
First of all, if it is just avoiding your error in the MyDropDown
grandchild component you can just add a ?
after the usersData variable like v-if="usersData?.length"
. This will remove your Can't read length of undefined
error.
Next is the way you’re trying to pass your props from parent to the child component. You are passing your users
data to usersData
prop of the Filters
component tag but are trying to get the props as filterData
in the component, which will not work as expected. So users
is considered with an undefined
value and is being the same into your grandchild which is causing an error in your grandchild i.e. MyDropDown
component.
Try mapping the prop names properly and avoid variable name repetition with that of the prop names inside any component.
If you are trying to send data from parent to grandchild directly you use the Provide/Inject
feature of Vue.js.
Find more about it here Provide/Inject | Vue.js