Стоит такая задача: передать компонент в компонент, что бы вывести его с нужными параметрами в цикле. Подробнее: есть массив данных
[{id: 1, value: 'Apple'}, {id: 2, value: 'Orange'}, {id: 3, 'Chery'}]
Есть неким компонент, который делает отрисовку полученного массива:
const CustomList = ({arr}) => {
return (
<View>
{
arr.map(item => {
return (<View><Text>{item.value}</Text></View>)
})
}
</View>
)
}
Структура массива будет одна и та же, а вот вид может меняться. Поэтому решил сделать, что бы вот эта часть
return (<View><Text>{item.value}</Text></View>)
передавалась как параметр. Только вот не хватает знаний, что бы понять, как это сделать, гугление не помогло.
Как мне правильно передать компонент и вызвать его с параметрами?
Дополнение: мне нужно, что бы я мог передать компонент в компонент, то есть сделать такой вызов
<CustomList arr=[] template=<View><Text>{item.value}</Text></View>>
А сам компонент переписать так
const CustomList = ({arr, template}) => {
return (
<View>
{
arr.map(item => {
return template // вот как тут подставить данные?
})
}
</View>
)
}
template
сущность почему вы не хотите там вернуть массив компонент? Я понимаю, что у вас различные шаблоны (template) могут быть, так каждый компонент и можно "переключать" в самом компонентеuseReducer
использовать. Для ваших целей я бы взял просто switch и через props прокидывал значение, относительно которого бы работала бы логика. Все зависит от задачи, как всегдаCustomList
вы передаете два параметра. Первый - массив, второй - шаблон. Вот этот шаблон (template
) что содержит? Ведь то что у вас написано не реально по логике, так какitem.value
при вызове не существует, и появится только при рендереCustomList