Ч
На любой странице будет работать + можно модалку будет отдельным компонентом сделать и мусор всякий в redux не собирать
Size: a a a
2021 July 02
ES
Не пойму... Я себе это представлял так - онкейпрес на инпуте. При нажатии на энтер установить состояние модалке isOpen , и если isOpen - поставить класс модалке active. Но я не пойму как передать пропсы с этим состоянием из инпута модалке .... Структура app , в нем инпут и модалка отдельными компонентами
ES
Можно конечно тупо модалку зафигачить внутри инпута, и так же делать, но так вроде плохо?
ES
Короче нужно тупо открыть модалку не при клике на кнопку, а при нажатии энтер в инпуте
ES
Первый раз это вижу, разбираться некогда, чуть позже изучу спасибо . А просто как я пишу что, не сделать? Всегда ж модалка вылазила просто при клике на кнопку, устанавливалось состояние isOpen, вешалася класс актив, и все ?? Почему так нельзя у моей задаче ?
Ч
Этот компонент у тебя уникальный будет ? он ничего больше делать не должен, то есть модалка ничего больше не делает кроме как показывает что-то там из инпута ?
ES
Смотри. Есть инпут . В него вводишь город и с апи приходят данные о погоде когда нажал энтер. В этот момент должна вылезти модалка, и показать эти данные в себе . Попап. Просто и все ) просто данные показываются не снизу там где то, а в модалке
Ч
Если так то смело хуячь компонент в котором и модалка и инпут будет, а если нет то лучше заморочься и сделай api для модалки нормальное чтоб как-то она вызвалась из любого места
Ч
1. useState, useEffect
2. redux/mobx/etc
2. redux/mobx/etc
ES
А юзЭффект зачем ? Я просто не пойму как пропсы передать из инпута в модалку . Как сказать, что при нажатии на энтер в инпуте, что бы.открылась модалка ? Без стм
Ч
Не знаю зачем может пригодится
Z
Доброго ранку понове, подскажите пожалуйста. На данный момент использую для стилизации styled components и изредка scss. Есть ли смысл смотреть библиотеку Material UI? Кто-то может сказать ее преимущества? Просто как не посмотрю, многие просят ее, но каждый раз открывая код проектов написанных на материал, то вижу куча велосипедов, отсутствие понимания что происходит, использование important для переписи приоритета стилейю
ES
Блин вроде элементарная задача , просто открыть модалку при нажатии энтер в инпуте , а я туплю как собака из за того что не понимаю как передать пропсы что ли
Ч
const [actionModal, setModal] = useState(false)
, [value, setValue] = useState('')
return (
<>
<input
value={value}
onChange={({ target: { value } }) => setValue(value)}
onKeyDown={({ keyCode }) => keyCode === 65 ? setModal(true) : null}
/>
{
actionModal
? (
<Modal data={value} onClose={() => setModal(false)} />
)
: null
}
</>
)
ES
Тоесть модал компонент делаем прям в инпуте ? В компоненте с инпутом
Ч
В твоем случае получается так
ES
А если сделать в апп их оба, то не получится пропсы передать без СТМ?
Ч
redux/mobx
ES
Ну да, я имею ввиду без стейт менеджера не передать никак состояние если внутри app лежат modal , input компоненты ? Из инпут к модалке