а зачем сериализация?
Если валидации общие на фронте и бэке
Таймураз
Александр
1. Стандарт
2. Сериализуется
3. Универсален
В случае formik, имеется изкоробочная интеграция с yup, например. А ajv придётся прикручивать
Таймураз
В случае formik, имеется изкоробочная интеграция с yup, например. А ajv придётся прикручивать
Не одним формиком мир сложен
К тому же прикручивать там особо нечего, у формика есть метод валидации
Таймураз
Александр
Не одним формиком мир сложен
К тому же прикручивать там особо нечего, у формика есть метод валидации
Понятно что не одним... просто к тому что иногда json schema для валидация это оверкилл. И весит ajv не мало на сколько я помню
Cenator 🐈
В случае formik, имеется изкоробочная интеграция с yup, например. А ajv придётся прикручивать
Мы валидируем только на бэке
Таймураз
Понятно что не одним... просто к тому что иногда json schema для валидация это оверкилл. И весит ajv не мало на сколько я помню
Yup не сказать, что сильно меньше весит
Andrey
Оппа. 8000
Bogdan
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 сразу не может возвращать засаспенсный компонент?
Александр
Утро доброе. А можете объяснить зачем реакту было разделять lazy и Suspence? Почему lazy сразу не может возвращать засаспенсный компонент?
Как-то не слишком понятно сформулировали вопрос имхо
N
Александр
Suspense задумывался и является более общим механизмом для асинхронного рендеринга дерева на основе которого в честности работает lazy. Этот же механизм позволяет отлавливать и резолвить синхронно брошенные через механизм исключений промисы, что даёт возможность уже сейчас применять это для подгрузки данных. Если верно понял ваш вопрос конечно. По этой причине и разделили.
N
Друзья помогите с import почему то не подключается, хотя все верно прописал
Dzmitry
Александр
Утро доброе. А можете объяснить зачем реакту было разделять lazy и Suspence? Почему lazy сразу не может возвращать засаспенсный компонент?
В дальнейшем ещё планируется асинхронный react-dom/render который будет опираться на наличие Suspense-нод в дереве
Vadym
Привет подскажите русскоязычную группу где всякие практики и дизайн реакта без обсуждений. Спасибо
Aiperi_NK
Ребята, большое спасибо Вам за помощь 👍🏻👍🏻👍🏻!!!
Danila
N
N
Rf
всем привет, что бы выбрали для из этих библиотек?
Судя по следующим требованиям
1) Легковесная
2) Можно тянуть модульно (Например только кнопки)
3) Большое комьюнити
4) Легко переопределять стили
5) Есть документация
6) Легкая в использовании
- Ant Design,
- Material,
- Blueprint,
- Attlasian Kit,
- Evergreen,
- Gormet
Vladimir
всем привет, что бы выбрали для из этих библиотек?
Судя по следующим требованиям
1) Легковесная
2) Можно тянуть модульно (Например только кнопки)
3) Большое комьюнити
4) Легко переопределять стили
5) Есть документация
6) Легкая в использовании
- Ant Design,
- Material,
- Blueprint,
- Attlasian Kit,
- Evergreen,
- Gormet
Semantic UI
Material
Blueprint
Attlasian Kit
и от майкрософта, забыл как называется
Александр
В дальнейшем ещё планируется асинхронный react-dom/render который будет опираться на наличие Suspense-нод в дереве
Как неофициальный proof of concept например можно посмотреть https://github.com/overlookmotel/react-async-ssr в исходниках сложно может быть если не разбирались в текущей кодовой базе реакта (именно с кооперативной многозадачностью, то что они называют Fiber), но смысл понять можно при желании
Danila
https://stackblitz.com/edit/react-aliexpress-xsm7v1?embed=1&file=layout.js
Да вроде работает всё
Bogdan
Bogdan
это в вс коде точно, но скорее всего в других иде тоже есть
倫太郎
N
Bogdan
Polina
Rf
Evgeny
а как сделать чтобы в компоненте Клик поддерживался? кликаю на него а оно ниче
artalar
Оо, хмм, уже 8к человеков в группе
artalar
Vladimir
а почему не Ант?
1) Он очень тяжеловесный. В 3-й версии, например, в бандл попадают 400к иконок, обойти можно только хаками
2) Много взаимных импортов, поэтому например при использовании только Button, вместе с ней тянутся Icon, Popover и т.п.
4) Некоторые вещи нельзя переопределить: например цвет бэджа. В Timeline тоже много хардкода
6) Очень неинтуитивно работают многие пропсы. Например один зависит от другого (точно помню такое в Avatar)
Костя
Есть какие-то алтернативы React transition group? Что-то больше похожее на VUE-вский transition?
artalar
@deep_freeze классический ант...
artalar
artalar
У меня сейчас ант и я оочень часто !important использую
Vladimir
У меня сейчас ант и я оочень часто !important использую
а переменные где переопределяешь? В вебпаке?
Vladimir
Да, это смех. Не понимаю, почему все за него так бьются
миллиард китайцев не может ошибаться
artalar
а переменные где переопределяешь? В вебпаке?
Я мимоходом на проекте, не вникал даже, делаю только точечные изменения
Filat
миллиард китайцев не может ошибаться
Сильный аргумент. Комменитровать его я, конечно, не буду.
N
Я не знаю что случилось, но она сама исправилась 😅
Oleg
Ребята, всем привет, подскажите, пожалуйста, те, кто пользуется mobx, как вы осуществляете роутинг по страницам? Пользовались ли вы этим методом https://github.com/mweststrate/state-routing-blog-sources и насколько он актуален, потому что репа 3-ех летней давности?
Shamshir
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
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)
Andrei
О, погуглил и вспомнил)) Обычно для таких вещей применяется матрица трансформации, не знаю как в реакте, но делается это обычно так...
1. Translate объект так, чтобы центр скейлинга был в координате (0, 0), тобишь будь центр скейлинга в точке (24, 54), мы делаем translate(-24, -54)
2. Применяем матрицу скейлинга на скоко нам надо scale(2, 2)
3. Возвращаем объект на место translate(24, 54)
то есть делать скейлинг в 2 этапа? сначала сместить сильно далеко, а потом обратно?
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
Andrei
Ну а чо нет, это css, у него есть трансформации, по изменению стейта меняешь style получаешь трансформацию))
очень крутое решение, сколько гуглил и 'работал' с этим- такого даже не знал) надо будет поглубже покапаться в этом дермеце)) благодарю) спасаешь не в первый раз
Андрей
this.setState((state, props) => ({
counter: state.counter + props.increment
}));
setState((counter, props) => counter + props.increment)
Adv0cat
очень крутое решение, сколько гуглил и 'работал' с этим- такого даже не знал) надо будет поглубже покапаться в этом дермеце)) благодарю) спасаешь не в первый раз
😅👍Пришлось как-то парсить svg формат, там нахватался этих матриц трасформаций, от туда и помню, но забываю саму реализацию ☺️ Пользуйся)