@BalgabayevD
Начинающий front-end программист

Как динамический отрендерить различные компоненты в React Native?

Напрмиере у меня есть стор с такими данными:
Page: [
{type: 'Button', label: 'Ok'},
{type: 'Card', label: 'News', Image: 'request...'},
{type: 'TextInput', placeholder: 'Hello'}
];

Эти компоненты необходимо динамический отрендерить на странице. Но напрмиер flatList рендерит компоненты только одного типа. Как такое можно реализовать?
  • Вопрос задан
  • 74 просмотра
Решения вопроса 1
Seasle
@Seasle Куратор тега JavaScript
Помог - отметь решением \( ゚ヮ゚)/
Лучше переделать структуру:
[
	{
		type: 'Button',
		props: {
			label: 'Ok'
		}
	},
	{
		type: 'Card',
		props: {
			label: 'News',
			Image: 'request...'
		}
	},
	{
		type: 'TextInput',
		props: {
			placeholder: 'Hello'
		}
	}
];

Тогда можно будет в методе render сделать так:
{{page.map(element => <element.type {...element.props} />)}}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы