Добрый вечер Есть массив объектов филдов для формы (текст инпуты, селекты,

Question

Добрый вечер Есть массив объектов филдов для формы (текст инпуты, селекты,

чекбоксы). Как будет правильнее их мапить, чтобы нужный компонент подставлялся, в зависимости от значения type в объекте филда. Тернарники/ифы/свичи использовать не хочется. Как правильнее будет в данной ситуации поступить?

#frontend #javascript #programming #react.js #russian

0

20.07.2023

13 ответов

5 просмотров

Isagi Автор вопроса

ап

0

11 месяцев назад

Isagi Автор вопроса

а как пропсы прокидывать, через cloneElement?

0

11 месяцев назад

Veli

Isagi
а как пропсы прокидывать, через cloneElement?

можно в аргументы функции передать, например или, собственно, в пропсы в варианте, если у тебя эта функция будет рендериться как компонент

0

11 месяцев назад

Isagi Автор вопроса

Veli
можно в аргументы функции передать, например или,...

огонь, спасибо

0

11 месяцев назад

Isagi Автор вопроса

Veli
const map = { [Type.Input]: () => <Input/>, [T...

а поч кстати () => <Input />, а не просто <Input /> или Input?

0

11 месяцев назад

Veli

Isagi
огонь, спасибо

по идее у тебя даже типизация должна корректно работать и подсказывать все

0

11 месяцев назад

Veli

Isagi
а поч кстати () => <Input />, а не просто <Input /...

не просто <Input/>, потому что у тебя: 1) сразу же будет создаваться этот компонент. Даже до его вставки 2) у тебя будет общий инстанс инпута на все применения

0

11 месяцев назад

Isagi Автор вопроса

Veli
const map = { [Type.Input]: () => <Input/>, [T...

извиняюсь за долгий ответ Тут кажется вызов лишний, если просто map[type] делать, то выводит, если добавить (), то ломается Возможно как то избежать того, что нужно дублировать типизацию для каждого филда? Т.е. я когда пишу (props) => <Input /> мне нужно props типизировать или он будет any

0

11 месяцев назад

Veli

Isagi
извиняюсь за долгий ответ Тут кажется вызов лишний...

во втором варианте лишний, да в первом нужен касаемо пропсов - кажется, у каждого типа компонента в теории должны быть разные пропсы но если у тебя по какой-то причине одинаковые, то можешь просто описать тип как Record<Type, FC<твоиПропсы>>

0

11 месяцев назад

Isagi Автор вопроса

Veli
во втором варианте лишний, да в первом нужен кас...

Согласен, да. До того, как ты написал, думал, что придется из каждого филда импортить тип и вставлять, но сейчас понял, что там не все пропсы понадобятся Как считаешь, нормальный вообще подход, если у меня есть тупые инпут/селект/чекбокс из которых я уже сделал филды для форм (добавил лейблы, доп. классы и тд)? И правильно ли с точки зрения фсд это всё в shared хранить? В очередной раз спасибо бтв)

0

11 месяцев назад

Veli

Isagi
Согласен, да. До того, как ты написал, думал, что ...

да, должен быть отдельный ui кит с базовыми компонентами и отдельно биндинги к форме, потому что не всегда ты будешь использовать их в форме ui кит должен лежать в shared/ui биндинги непонятно, но я когда делал ложил в shared/lib/form. Название либы может быть любым, для примера указал. Сама суть в том, что биндинги для формы не являются ui китом, несмотря на то, что являются компонентами

0

11 месяцев назад

Veli

Veli
да, должен быть отдельный ui кит с базовыми компон...

когда я отвечал в чате fsd, что как будто бы такое нужно в либ класть, вроде, реакции были в основном положительные кто-то в ui кладет, кто-то вот в lib. Можешь поискать по ключевым словам, может найдешь, я там заводил диалог на эту тему

0

11 месяцев назад

Veli · Accepted Answer

Veli

const map = { [Type.Input]: () => <Input/>, [Type.Checkbox]: () => <Checkbox/>, } {map[type]() или const Component = map[type]() <Component/>

0

11 месяцев назад

169 похожих чатов

Добрый вечер Есть массив объектов филдов для формы (текст инпуты, селекты,

13 ответов

Похожие вопросы