Anonymous
При каких причинах этот компонент будет Unmount? только от переменной costCategoryId? и Unmount Родителя?
Bogdan
странно то, что они до этого не подсасались) ты же стейт меняешь
в том то и дело, стейт меняется, но селектов еще нету, стейт поменялся -> рендер формы, уже после рендера и того, как поменялся стейт летит запрос для получения данных о селектах, тоесть изначально их нет, запрос выполнен, но перерисовка не происходит, а вот если сделать подписку, то вроде кул
Andrei
а, я тебя понял. поменяй данные в стейте. именно верни новую копию стейта, как {...state, data: fetchedData}; и у тебя обновятся компоненты, так как меняется ссылка на стейт. проверка изменения стейта в реатке( да и в других либах/фреймворках, как ангулар) просходит только если меняется ссылка на обьект. по shallowEqual @bshelomanov
Bogdan
а вот еще прикол, разве можно валидировать поле, относительно выбранного селекта?
Nikita
Доброго времени суток! Прошу помощи. Есть какая нибудь изоляция стилей и js у Material-ui на странице внутри которой я размещаю свое react приложение?
Andrei
а вот еще прикол, разве можно валидировать поле, относительно выбранного селекта?
да, какой тип валидации используешь? асинхронное или на сабмите?
Andrei
хз, стандартную при сабмите ,
https://upmostly.com/tutorials/form-validation-using-custom-react-hooks
Andrei
используй просто value с селекта
Bogdan
https://upmostly.com/tutorials/form-validation-using-custom-react-hooks
это не то, вот люди захотели, есть селект, есть поле, из селекта в поле попадает строка, но если в селекте выбрать один пункт, то поле - не обязательно, выбрать другой пункт и оно становится обязательным
Bogdan
yup вроде может так, ща чекну
Andrei
это не то, вот люди захотели, есть селект, есть поле, из селекта в поле попадает строка, но если в селекте выбрать один пункт, то поле - не обязательно, выбрать другой пункт и оно становится обязательным
внутри валидатора повесь проверку на то, необходимо оно или нет) у тебя есть доступ к исходным данным, ищи по значению в селекте и смотри по флагу(required или нет) что-то типа: const initValue = [{ name:'tratata', isRequired: true }] в валидаторе: const obj = initValue.find((value)=>value.name === selector.value); if(obj.isRequired){ if(input.value.length <1) { return error } }
Andrei
а по каким критериям определяется необходимость?
Andrei
нету возможности навесить флаг isRequired на значения
если по чему-то особенному внутри строки- парсь строку и смотри- логика та же
Andrei
по словам менеджера
он сидит и смотрит за всеми пользователями?)) ладно, я не понимаю логику твоего приложения
Bogdan
он сидит и смотрит за всеми пользователями?)) ладно, я не понимаю логику твоего приложения
он хочет, при выборе res, делать следующее поле обязательным, а при выборе других пунктов нет, у бека попросить прислать параметр required и относительно него валидировать вариант норм будет?
Mikhail
народ, привет! начал искать юай кит для сложного и навороченного бекофиса (такая админка на максималках). вообще искренне не понимал, как можно юзать юай киты, но сейчас дошло, что для внутренних инструментов вполне ок. вопрос такой - antd подходит по набору компонентов, большой вес бандла значения не имеет, стоит его брать или есть что-то еще для подобных целей?
Andrey
material, bootstrap
Nikita
Кто вкурсе в Material-ui можно ли все стили прикрутить к родительскому классу для изоляции?
Eugene
bootstrap :troll
Andrei
он хочет, при выборе res, делать следующее поле обязательным, а при выборе других пунктов нет, у бека попросить прислать параметр required и относительно него валидировать вариант норм будет?
в этом случае да, так как если ты жестко вобьешь типа if(value === '{rs}/RS')-это будет не масштабируемо, а заказчики такие, что они быстро меняют свои хотелки)) так что либо на бэк запрос, либо( лучше всего) получай с бека обьекты. с ключом под это все. и даже можешь хранить как значение.типа {name:'',isRequired:true}
Mikhail
а где посмотреть?
Andrei
сча, секу, скину как я вижу твой селект)
Mikhail
в материале примерно тот же набор компонентов, что и в antd. остальные киты заметно уступают что выбрать, если важна скорость разработки, кастомизировать ничего не нужно будет сильно. или все равно?
Bogdan
сча, секу, скину как я вижу твой селект)
вот так, я пока думаю над вариантом передать обьект с полями в валидатор юпа
Bogdan
сча, секу, скину как я вижу твой селект)
а , я придумал, у формика есть валидация каждого поля отдельно, я для каждого такого поля напишу свой валидатор и передам обьект полей, которые типо обязательны, если бек решит прислать мне поля с флагом required, отфильтрую по ним поидее
Andrei
https://codesandbox.io/s/naughty-mendel-3zyjq @bshelomanov
Andrei
вот так просто проверяй)
Yuriy
Гайз, хелп! Почему ReactRedux.Provider не обеспечивает передачу dispatch во вложенные компоненты? или он только в компоненты первого уровня вложенности? https://codepen.io/roskoshinsky/pen/NWKamGZ
Yuriy
Нет, и не должен. Юзай connect и mapDispatchToProps с теми компонентами, в которых тебе нужно вызывать экшны.
А зачем тогда провайдер нужен? Ведь, учитывая, что стор итак глобальный я могу его передать в пропсы где угодно?
arts
Провайдер нужен для создания контекста.
Adv0cat
Чот redux чатик тихий, спрошу здесь)) Вопрос об архитектуре с применением редакса в реакт spa: Хороша ли практика разделения логики общения с сервером и react, и дальнейшее общение этой логики и реакта через состояние редакса, кидаясь экшенами? P.s. 1. Есть redux стор 2. Есть визуальное отображение на react 3. Есть отдельное место, в котором идет общение с серваком, будь то rest или socket 4. Визуальный react, если хочет какие-то данные, просит их кидая экшен 5. В redux срабатывает редьюсер, который говорит отдельному месту сделай запрос 6. Отдельное место долго думает, лопатит, получает данные или ошибку и кидается экшеном 7. В redux срабатывает редьюсер и меняет стейт таким образом, что react реагирует на это как-то визуально 8. Предположим произошло обновление данных или сработал ивент в отдельном месте, и пришли новые данные без запроса, кинули экшен в редакс, если какой-то компонент слушал изменение стейта, то перерендерился, если нет, то и замечательно. P.p.s. Просто идея использовать саги, санки и прочую лабуду меня угнетает, я просто хочу сделать обычную логику отдельно, а redux использовать только как global state и global event loop, а react как Viewer
Anonymous
Чот redux чатик тихий, спрошу здесь)) Вопрос об архитектуре с применением редакса в реакт spa: Хороша ли практика разделения логики общения с сервером и react, и дальнейшее общение этой логики и реакта через состояние редакса, кидаясь экшенами? P.s. 1. Есть redux стор 2. Есть визуальное отображение на react 3. Есть отдельное место, в котором идет общение с серваком, будь то rest или socket 4. Визуальный react, если хочет какие-то данные, просит их кидая экшен 5. В redux срабатывает редьюсер, который говорит отдельному месту сделай запрос 6. Отдельное место долго думает, лопатит, получает данные или ошибку и кидается экшеном 7. В redux срабатывает редьюсер и меняет стейт таким образом, что react реагирует на это как-то визуально 8. Предположим произошло обновление данных или сработал ивент в отдельном месте, и пришли новые данные без запроса, кинули экшен в редакс, если какой-то компонент слушал изменение стейта, то перерендерился, если нет, то и замечательно. P.p.s. Просто идея использовать саги, санки и прочую лабуду меня угнетает, я просто хочу сделать обычную логику отдельно, а redux использовать только как global state и global event loop, а react как Viewer
не осилил
Adv0cat
не осилил
бяда 😅
Dartess
Чот redux чатик тихий, спрошу здесь)) Вопрос об архитектуре с применением редакса в реакт spa: Хороша ли практика разделения логики общения с сервером и react, и дальнейшее общение этой логики и реакта через состояние редакса, кидаясь экшенами? P.s. 1. Есть redux стор 2. Есть визуальное отображение на react 3. Есть отдельное место, в котором идет общение с серваком, будь то rest или socket 4. Визуальный react, если хочет какие-то данные, просит их кидая экшен 5. В redux срабатывает редьюсер, который говорит отдельному месту сделай запрос 6. Отдельное место долго думает, лопатит, получает данные или ошибку и кидается экшеном 7. В redux срабатывает редьюсер и меняет стейт таким образом, что react реагирует на это как-то визуально 8. Предположим произошло обновление данных или сработал ивент в отдельном месте, и пришли новые данные без запроса, кинули экшен в редакс, если какой-то компонент слушал изменение стейта, то перерендерился, если нет, то и замечательно. P.p.s. Просто идея использовать саги, санки и прочую лабуду меня угнетает, я просто хочу сделать обычную логику отдельно, а redux использовать только как global state и global event loop, а react как Viewer
"отдельное место" это же и есть, например, санки. Почему общепринятый способ запроса данных в редаксе (без привлечения, собственно, редьюсера, при чём он тут вообще?) угнетает, а желание написать свой костыль в виде "отдельного места" не угнетает?)
Adv0cat
"отдельное место" это же и есть, например, санки. Почему общепринятый способ запроса данных в редаксе (без привлечения, собственно, редьюсера, при чём он тут вообще?) угнетает, а желание написать свой костыль в виде "отдельного места" не угнетает?)
Меня смущает само существование middleware, там где можно сделать простой класс общения и обработки сообщений от сервера и логики какой-то, начинается наворачивание каких-то промежуточных штук, в которых есть свое апи и ты под это апи должен подстраиваться каким-то хитрым способом, вместо того, чтобы сделать логику так, как тебе удобно
Anonymous
Ребят подскажите на react хороший слайдер с сильным api. Slick не предлогать
Adv0cat
"отдельное место" это же и есть, например, санки. Почему общепринятый способ запроса данных в редаксе (без привлечения, собственно, редьюсера, при чём он тут вообще?) угнетает, а желание написать свой костыль в виде "отдельного места" не угнетает?)
Ну вот банально, хочу использовать axios, есть какие-то хуки @use-hooks/axios, какие-то мидлвари redux-axios-middleware... Зачем это все, если можно же просто кинуть экшен внутри компонента, в отдельной функции красиво сделать запрос через нормальное апи axios, и как придет ответ, все так же кинуть экшен ))
Bogdan
https://codesandbox.io/s/naughty-mendel-3zyjq @bshelomanov
isRequired бек не присылает, я если попрошу, возможно пришлет
Andrei
isRequired бек не присылает, я если попрошу, возможно пришлет
в идеальном случае попроси просто чтобы они тебе прислали массив обьектов с этим полем)
Bogdan
и там не имя попадает а id, по id значение как засовывает в селект так и высовывает
Andrei
и там не имя попадает а id, по id значение как засовывает в селект так и высовывает
просто делать запрос внутри валидатора, тем более не асинхронного-это бяка большая, неповоротливая и тяжелая. стукни их, чтобы они сделали так, как тебе надо
Andrei
а у нас аполо, я из кеша данные могу взять поидее и отфильтровать по параметру
все равно.. а если не будет доступен аполо, то ты будешь делать бешеный запрос на серв?) им не будет никакой разницы что писать: либо написать еще один роут, который будет еще иметь логику и тд, или же просто добавить к респонсу 1 поле. я считаю, что написать 1 строку проще, чем 15)
Dmitriy
подскажите карусель нормальную? что б мне допиливать ниче не пришлось
Artem
ребят, есть ли у кого-то на примете, примерчик с реализацией Infinity-scroll? по прокрутке окна вниз, буду отправлять новый запрос (Fetch).
Adv0cat
Описал сейчас санку. Кинул санку внутри компонента, в отдельной функции (санке) красиво сделал запрос, и всё так же кинул экшн по результатам запроса)
У меня все еще остается вопрос, что сделает такого thunk, чего не сделает подход описаный ранее мной? 🙂 И если ничего, то возникает вопрос, зачем тянуть лишнюю зависимость? 🙂 Я правда хочу понять 🙂
Andrey
У меня все еще остается вопрос, что сделает такого thunk, чего не сделает подход описаный ранее мной? 🙂 И если ничего, то возникает вопрос, зачем тянуть лишнюю зависимость? 🙂 Я правда хочу понять 🙂
чтобы не размазывать логику по разным местам удобно понимать, что сайд эффекты выполняются в санках отдельные места - нужно документировать, вводить в них новых разрабов, поддерживать, итп если бизнес логику держать в разных слоях - получается в итоге очень больно стейт менеджер тут стоит понимать как основу, структуру проекта, только там протекают процессы связанные с бизнес логикой, реакт просто реагирует на изменения в стейте приложения
Dartess
У меня все еще остается вопрос, что сделает такого thunk, чего не сделает подход описаный ранее мной? 🙂 И если ничего, то возникает вопрос, зачем тянуть лишнюю зависимость? 🙂 Я правда хочу понять 🙂
Может, кто-то другой пояснит за то, что редьюсер в редаксе должен быть чистой функцией, поэтому не может инициализировать запросы... Я не помню, почему. А санки как "лишнюю зависимость" я перестал бояться, когда прочитал все 14 строк их исходников (включая переносы строк и экспорт)
Sayo
Здравствуйте, такой вопрос. Допустим у меня есть два компонента, один прокидывает пропсы в другой, и тот на их основе прямо в рендере высчитывает переменные, которые необходимы для отображения данных. Но проблема в том, что т.к они высчитываются в рендере, то если я вызываю там какой-то метод (например {this.renderCaption(...)}, то мне нужно каждый раз прокидывать эти переменные внутри метода, а если в самом методе this.renderCaption вызывается какой-то другой, то мне и туда приходится прокидывать эти переменные что выглядит как дублирование и не очень красиво. Хотелось бы чтобы все эти доп.переменные хранились в стейте компонента и перерасчитывались когда в него прилетают новые пропсы. Как я понимаю для этого можно использовать componentDidUpdate(), но проблема в том что там нужно будет делать не очень красивую проверку и сравнивать изменились ли пропсы по сравнению с предыдущим состоянием. Может есть какой-то более элегантный способ?
Adv0cat
чтобы не размазывать логику по разным местам удобно понимать, что сайд эффекты выполняются в санках отдельные места - нужно документировать, вводить в них новых разрабов, поддерживать, итп если бизнес логику держать в разных слоях - получается в итоге очень больно стейт менеджер тут стоит понимать как основу, структуру проекта, только там протекают процессы связанные с бизнес логикой, реакт просто реагирует на изменения в стейте приложения
Хорошее объяснение! Кажется это будет холиваром, но можно немного порассуждать?) Если да, то: Вы говорите что стейт менджмент это и есть основа, структура проекта. Это замечательно, я тоже так думаю! Мне кажется, что таки redux это не совсем стейт менеджер, а скорее просто голый стейт с событиями. А это означает, что вынеся логику стейт менеджмента в отдельное место и будет означать, что это место будет называться стейт менеджером, будет вести наблбюдение за состоянием и выполнять любые логические задачи 🙂
Adv0cat
да, но зачем велосипедить свой СМ в связке с редаксом? 🧐 тут важно понимать, какую проблему решает "отдельное место"
По сути меня ужасают рельсы, хочу машину на колесах и дороги, а не только по рельсам )))
Andrey
По сути меня ужасают рельсы, хочу машину на колесах и дороги, а не только по рельсам )))
слишком абстрактно) редакс - скорее ноги идти дольше, муторнее, но пройдет уж он то реально, где угодно)
Adv0cat
слишком абстрактно) редакс - скорее ноги идти дольше, муторнее, но пройдет уж он то реально, где угодно)
Ну мидлвари, для меня, это рельсы, а отдельное место это место, где я хоть машину, хоть велосипед, хоть ноги взял, хоть рельсы, но я волен выбирать))
Artem
ребят, есть ли у кого-то на примете, примерчик с реализацией Infinity-scroll? по прокрутке окна вниз, буду отправлять новый запрос (Fetch).
Andrey
Ну мидлвари, для меня, это рельсы, а отдельное место это место, где я хоть машину, хоть велосипед, хоть ноги взял, хоть рельсы, но я волен выбирать))
да почему рельсы то) с ними что угодно сделать можно, я имею ввиду теже санки можно оборачивать в контейнеры, и спокойно любую логику строить //createConnection.js const createConnection = (config, store) => { const instance = axios.create(config); instance.interceptors.use(null, (err) => store.dispatch(apiError(err))); return instance; } //connection.js import {store} from "..."; export const connection = createConnection({...}, store); вот, тут вся БЛ крутится внутри редакса, наружу торчит только то, что должно и так что, и как угодно можно задекорировать, инкапсулируя логику в эти контейнеры
Adv0cat
Я вот говорю о чем-то таком, и делай логику внутри сколько угодно в любых проявлениях :)
Adv0cat
да, но зачем логику в отдельный контейнер класть, я хз)
Но мидлвари все такой же компонент логики, но он находится между экшеном и редьюсером, мне кажется это таки для другого, это если нужно сделать formatAction какой-то 🙂
Andrey
смысл в том, что можно написать БЛ и без миддлварей, на голом редаксе чем писать какие то отдельные контейнеры и как то их потом биндить к редаксу чтобы потом не воспользоваться даже профитом от них)
Adv0cat
мидлвари - просто расширение базовых возможностей, как плагин
Правильно, запихивая бизнес логику в плагин, вы тем самым становитесь на рельсы, как по мне))
Andrey
Правильно, запихивая бизнес логику в плагин, вы тем самым становитесь на рельсы, как по мне))
да в какой плагин то санки - просто инструмент для сайд эффектов я не понимаю, в чем там рельсовость
Adv0cat
Может мы говорим об одном и том же, только разными терминами?)))