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

Question

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

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

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

0

20.07.2023

13 ответов

10 просмотров

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

ап

0

20.07.2023

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

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

0

20.07.2023

Veli

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

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

0

20.07.2023

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

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

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

0

20.07.2023

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

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

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

0

20.07.2023

Veli

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

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

0

20.07.2023

Veli

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

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

0

20.07.2023

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

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

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

0

21.07.2023

Veli

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

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

0

21.07.2023

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

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

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

0

21.07.2023

Veli

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

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

0

21.07.2023

Veli

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

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

0

21.07.2023

Veli · Accepted Answer

Veli

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

0

20.07.2023

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

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

13 ответов

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