Таймураз
а зачем сериализация?
Если валидации общие на фронте и бэке
Александр
1. Стандарт 2. Сериализуется 3. Универсален
В случае formik, имеется изкоробочная интеграция с yup, например. А ajv придётся прикручивать
Таймураз
В случае formik, имеется изкоробочная интеграция с yup, например. А ajv придётся прикручивать
Не одним формиком мир сложен К тому же прикручивать там особо нечего, у формика есть метод валидации
Александр
Не одним формиком мир сложен К тому же прикручивать там особо нечего, у формика есть метод валидации
Понятно что не одним... просто к тому что иногда json schema для валидация это оверкилл. И весит ajv не мало на сколько я помню
Andrey
Оппа. 8000
Andrei
а что за ошибка то
Mixed Content: The page at 'https://codesandbox.io/' was loaded over HTTPS, but requested an insecure resource 'http://wow.kg/crm/api/?action=list&object=api_articles'. This request has been blocked; the content must be served over HTTPS.
Андрей
Утро доброе. А можете объяснить зачем реакту было разделять lazy и Suspence? Почему lazy сразу не может возвращать засаспенсный компонент?
Александр
Suspense задумывался и является более общим механизмом для асинхронного рендеринга дерева на основе которого в честности работает lazy. Этот же механизм позволяет отлавливать и резолвить синхронно брошенные через механизм исключений промисы, что даёт возможность уже сейчас применять это для подгрузки данных. Если верно понял ваш вопрос конечно. По этой причине и разделили.
N
Друзья помогите с import почему то не подключается, хотя все верно прописал
Dzmitry
серьёзно?)
Александр
Утро доброе. А можете объяснить зачем реакту было разделять lazy и Suspence? Почему lazy сразу не может возвращать засаспенсный компонент?
В дальнейшем ещё планируется асинхронный react-dom/render который будет опираться на наличие Suspense-нод в дереве
N
серьёзно?)
Да ctr+c ctr+v
Vadym
Привет подскажите русскоязычную группу где всякие практики и дизайн реакта без обсуждений. Спасибо
Aiperi_NK
Ребята, большое спасибо Вам за помощь 👍🏻👍🏻👍🏻!!!
Danila
Так ты в src находишься, тебе не надо ./src/, нужно from './reducers/ Тебе IDE не подсказывает?
Danila
Нет это онлайн редактор
Ну так кинь ссылку
Rf
всем привет, что бы выбрали для из этих библиотек? Судя по следующим требованиям 1) Легковесная 2) Можно тянуть модульно (Например только кнопки) 3) Большое комьюнити 4) Легко переопределять стили 5) Есть документация 6) Легкая в использовании - Ant Design, - Material, - Blueprint, - Attlasian Kit, - Evergreen, - Gormet
Александр
В дальнейшем ещё планируется асинхронный react-dom/render который будет опираться на наличие Suspense-нод в дереве
Как неофициальный proof of concept например можно посмотреть https://github.com/overlookmotel/react-async-ssr в исходниках сложно может быть если не разбирались в текущей кодовой базе реакта (именно с кооперативной многозадачностью, то что они называют Fiber), но смысл понять можно при желании
N
Ну так кинь ссылку
https://stackblitz.com/edit/react-aliexpress-xsm7v1?embed=1&file=layout.js
N
Да вроде работает всё
Хм да только что проверил работает, значит интернет тормозил
Bogdan
а еще если нажать ctrl + space, то редактор сам путь найдет
Bogdan
это в вс коде точно, но скорее всего в других иде тоже есть
倫太郎
Ну так ты и так в src
N
вот
Bogdan
ну вот тут прям видно, что в src
Polina
приветы. У меня вопрос по graphQL (gatsby) почему не работает переменная фильтрах?
Evgeny
а как сделать чтобы в компоненте Клик поддерживался? кликаю на него а оно ниче
artalar
а почему не Ант?
4 пункт точно вылетает
artalar
Оо, хмм, уже 8к человеков в группе
Rf
4 пункт точно вылетает
там less, я пока копаюсь и смотрю как люди решают эти задачи
Vladimir
а почему не Ант?
1) Он очень тяжеловесный. В 3-й версии, например, в бандл попадают 400к иконок, обойти можно только хаками 2) Много взаимных импортов, поэтому например при использовании только Button, вместе с ней тянутся Icon, Popover и т.п. 4) Некоторые вещи нельзя переопределить: например цвет бэджа. В Timeline тоже много хардкода 6) Очень неинтуитивно работают многие пропсы. Например один зависит от другого (точно помню такое в Avatar)
Костя
Есть какие-то алтернативы React transition group? Что-то больше похожее на VUE-вский transition?
artalar
@deep_freeze классический ант...
artalar
Падинги там вообще веселые. Что это вообще…
artalar
У меня сейчас ант и я оочень часто !important использую
Vladimir
Падинги там вообще веселые. Что это вообще…
и комменты в коде на китайском
Vladimir
У меня сейчас ант и я оочень часто !important использую
а переменные где переопределяешь? В вебпаке?
Filat
и комменты в коде на китайском
Да, это смех. Не понимаю, почему все за него так бьются
Vladimir
Да, это смех. Не понимаю, почему все за него так бьются
миллиард китайцев не может ошибаться
artalar
а переменные где переопределяешь? В вебпаке?
Я мимоходом на проекте, не вникал даже, делаю только точечные изменения
Filat
миллиард китайцев не может ошибаться
Сильный аргумент. Комменитровать его я, конечно, не буду.
N
Я не знаю что случилось, но она сама исправилась 😅
Oleg
Ребята, всем привет, подскажите, пожалуйста, те, кто пользуется mobx, как вы осуществляете роутинг по страницам? Пользовались ли вы этим методом https://github.com/mweststrate/state-routing-blog-sources и насколько он актуален, потому что репа 3-ех летней давности?
Shamshir
здарова, в match > params > id выходит undefined. может кто подсказать в чем проблема?
Shamshir
Andrei
кто может подсказать как правильно рассчитывать translateX/Y для зумирования? при использования transform со scale и translate на данный момент рассчитываю так, но проблема в том, что когда зум > 2 происходит сьезжание 'центра' как *нормализировать* смещение? let newScale = state.scale + (+action.payload.direction * scaleStep); newScale = Math.max(Math.min(newScale, maxScale), minScale); if(newScale === state.scale){ return state; } const realX = (zoomCenter.x - state.translateX)/state.scale; const realY = (zoomCenter.y - state.translateY)/state.scale; let newTranslateX = (-realX * newScale + zoomCenter.x); let newTranslateY = (-realY * newScale + zoomCenter.y);
Shamshir
здарова, в match > params > id выходит undefined. может кто подсказать в чем проблема?
решил проблему. версия react router dom было 4.3.1 обновил до 5го
Adv0cat
кто может подсказать как правильно рассчитывать translateX/Y для зумирования? при использования transform со scale и translate на данный момент рассчитываю так, но проблема в том, что когда зум > 2 происходит сьезжание 'центра' как *нормализировать* смещение? let newScale = state.scale + (+action.payload.direction * scaleStep); newScale = Math.max(Math.min(newScale, maxScale), minScale); if(newScale === state.scale){ return state; } const realX = (zoomCenter.x - state.translateX)/state.scale; const realY = (zoomCenter.y - state.translateY)/state.scale; let newTranslateX = (-realX * newScale + zoomCenter.x); let newTranslateY = (-realY * newScale + zoomCenter.y);
О, погуглил и вспомнил)) Обычно для таких вещей применяется матрица трансформации, не знаю как в реакте, но делается это обычно так... 1. Translate объект так, чтобы центр скейлинга был в координате (0, 0), тобишь будь центр скейлинга в точке (24, 54), мы делаем translate(-24, -54) 2. Применяем матрицу скейлинга на скоко нам надо scale(2, 2) 3. Возвращаем объект на место translate(24, 54)
Adv0cat
то есть делать скейлинг в 2 этапа? сначала сместить сильно далеко, а потом обратно?
А иначе у тебя будет ездить перемещение, т.к. погрешности будут полюбому, а при подходе матрицы трансформации, происходит простая математика, которая не даст тебе погрешностей. Тупое объяснение, но как есть))
Andrei
хм.. интересно) осталось придумать как это сделать со стейтам и ***хами
Adv0cat
Причем ты можешь css использовать для этого, и тебе не нужно будет это делать вручную в пару этапов http://frontendnews.ru/izuchaem-matricy-transformaciy-v-css
Adv0cat
хм.. интересно) осталось придумать как это сделать со стейтам и ***хами
Как-то так .youClass { transform: translate(-24px,-54px) scale(2, 2) translate(24px,54px); }
Andrei
эммм) а так пройдет? сейчас проверю
Adv0cat
эммм) а так пройдет? сейчас проверю
Ну а чо нет, это css, у него есть трансформации, по изменению стейта меняешь style получаешь трансформацию))
Bohdan
Чего?
this.setState((state, props) => ({ counter: state.counter + props.increment }));
Andrei
Ну а чо нет, это css, у него есть трансформации, по изменению стейта меняешь style получаешь трансформацию))
очень крутое решение, сколько гуглил и 'работал' с этим- такого даже не знал) надо будет поглубже покапаться в этом дермеце)) благодарю) спасаешь не в первый раз
Андрей
this.setState((state, props) => ({ counter: state.counter + props.increment }));
setState((counter, props) => counter + props.increment)
Adv0cat
очень крутое решение, сколько гуглил и 'работал' с этим- такого даже не знал) надо будет поглубже покапаться в этом дермеце)) благодарю) спасаешь не в первый раз
😅👍Пришлось как-то парсить svg формат, там нахватался этих матриц трасформаций, от туда и помню, но забываю саму реализацию ☺️ Пользуйся)