Ты же хотел логировать активность юзера клоуняра

!ро хейт

зачем тебе либа? сделай хок который будет ловить клики и отправлять куда-нибудь в апишке имя компонента, там ну максимум 50 строк

Выше писал. Ну смотри, в библиотеке наверняка решены эджкейсы, что-то продумано и оптимизировано. Redux-logger уже помог понять какое апи должно быть у хока, а hotjar помог понять что вообще можно сделать и какую выборку данных можно кормить моделе

Выше писал. Ну смотри, в библиотеке наверняка решены эджкейсы, что-то продумано и оптимизировано. Redux-logger уже помог понять какое апи должно быть у хока, а hotjar помог понять что вообще можно сделать и какую выборку данных можно кормить моделе

слова "библиотека" и "наверняка" лучше в одном предложении не упоминать как можно оптимизировать ивентлиснер кроме как дебаунса/троттла?

Привет всем. Кто работал с Grid CSS? Пытаюсь разобраться, но не могу понять, как например компоненты для текста создавать? Флексами? Или можно просто через маржин/паддинг отступы делать, главное чтоб это было внутри grid-template-colums?

слова "библиотека" и "наверняка" лучше в одном предложении не упоминать как можно оптимизировать ивентлиснер кроме как дебаунса/троттла?

не вешать эвенты в цикле на все дом элементы, наверное?)

не вешать эвенты в цикле на все дом элементы, наверное?)

а кто сказать что хок вешает эвенты на весь дом? нужно логить - оборачиваешь

а кто сказать что хок вешает эвенты на весь дом? нужно логить - оборачиваешь

И опять таки гонять данные, собирать временную статистику с большей точностью и так далее. Тут выше было предложение такое, я не при чём

на документ повесь mousemove, click

и по координатам смотри, че куда ткнули

как ещё проще-то

И опять таки гонять данные, собирать временную статистику с большей точностью и так далее. Тут выше было предложение такое, я не при чём

https://github.com/faouzioudouh/react-tracker ну вот какая-то рандомная, но там опять же все на ивентах

"мне нужна либа" это болезнь js npm install add-two-number

ребят никто не знает работает ли modernizr в ie6-9?

ребят никто не знает работает ли modernizr в ie6-9?

Лучше напиши ишью у них в репе и спроси. Ie6 пиздец)

Компонент делает запрос к серверу. Если все нормально, данные поступят в объект состояния (использую MobX). А если ненормально, компонет должен отрисоваться с отображением ошибки. Правильно я это релизовал? (Работает, но я не уверен, что это грамотный подход)

Всем привет!

Компонент делает запрос к серверу. Если все нормально, данные поступят в объект состояния (использую MobX). А если ненормально, компонет должен отрисоваться с отображением ошибки. Правильно я это релизовал? (Работает, но я не уверен, что это грамотный подход)

Так нельзя делать

Так нельзя делать

Можно чуть подробней?

Можно чуть подробней?

Ну запросы в рендере

Кто нибудт работал с react-qr-reader? мне необходимо с веб страницы на телефоне считать qr code, с помощью данной библиотеки на компе спокойно счиываю, но на телефоне запроса на использование камеры нет

Ну запросы в рендере

А почему? Запрос обновляет состояние приложения (MobX), и то, что нужно отрисуется заново, когда данные поступят.

отрисуется заново и запросится заново, отрисуется = выполнится запрос из рендера

всем привет! можно как нибудь в компоненте с Redux в actionCreators пропихнуть параметр из пропсов?

передавай в качестве параметра функции, в чем проблема?

отрисуется заново и запросится заново, отрисуется = выполнится запрос из рендера

ну вообще если совсем в дебри лезть, то рендер реакта != отрисовка вернее не всегда равно

всем привет! можно как нибудь в компоненте с Redux в actionCreators пропихнуть параметр из пропсов?

Ты же передаешь в actionCreator все что захочешь

Ты же передаешь в actionCreator все что захочешь

мне не совсем понятно, как туда пропсы комопнента пропихнуть

ну вообще если совсем в дебри лезть, то рендер реакта != отрисовка вернее не всегда равно

Да есть такое, но там более чем понятно что я имел ввиду.

ну вообще если совсем в дебри лезть, то рендер реакта != отрисовка вернее не всегда равно

вернее всегда "не равно" :) если уж лезть в дебри :) сверка и сброс изменений в реальный DOM - к вызову функций рендера, вообще касательство имеют слабое, особенно теперь с Fibers и асинхронным рендерингом и т.д. и т.п.

ну вы и закопались конечно)

мне не совсем понятно, как туда пропсы комопнента пропихнуть

actionName(props.propName)

actionName(props.propName)

понял, спасибо, посмотрю

вернее всегда "не равно" :) если уж лезть в дебри :) сверка и сброс изменений в реальный DOM - к вызову функций рендера, вообще касательство имеют слабое, особенно теперь с Fibers и асинхронным рендерингом и т.д. и т.п.

агрид отрисовка происходит после сравнения вдома и дома, а рендер просто возвращает новую версию вдома (или ту же)

Edited, не душите

отрисуется заново и запросится заново, отрисуется = выполнится запрос из рендера

Ну да. Я это отслеживаю на уровне функции, которая обращается к серверу. Если данные уже поступили, то она ничего не делает. Поэтому рендер происходит только два раза (один раз - первый, второй - когда поступили данные). А как более грамотно это реализовать?

Ну да. Я это отслеживаю на уровне функции, которая обращается к серверу. Если данные уже поступили, то она ничего не делает. Поэтому рендер происходит только два раза (один раз - первый, второй - когда поступили данные). А как более грамотно это реализовать?

Я бы в didMount затолкал его P.S. Страшно капец, щас старожилы тапками кидать будут)

Народ привет 👋, подскажите пожалуйста по валидации formik с помощью yup. Есть инпут в которое вводится id это может только int, либо поле может остаться пустым. В принципе yup.number().nullable() работает как ожидается, НО, если в поле ввести любое значение, а затем его стереть - поле валидацию не проходит

Я бы в didMount затолкал его P.S. Страшно капец, щас старожилы тапками кидать будут)

А конструктор - не то же самое?

Ну да. Я это отслеживаю на уровне функции, которая обращается к серверу. Если данные уже поступили, то она ничего не делает. Поэтому рендер происходит только два раза (один раз - первый, второй - когда поступили данные). А как более грамотно это реализовать?

https://ru.reactjs.org/docs/react-component.html#componentdidmount Там написано, или конструктор

Смотря что тебе там нужно, если например нужно отрисовать формочку с заполенниями я бы в дидмаунт пихал, потомучто форма может сначала пустой показаться с лоадером каким то. Если компоненту до рендера нужны эти данные, то лучше в конструктор

Проблема в следующем. Это компонент постов. Так вот. Если с одного поста на другой переходить то конструктор (и дидмаунт) не выполняется. И тогда у меня новый пост не загрузится.

Проблема в следующем. Это компонент постов. Так вот. Если с одного поста на другой переходить то конструктор (и дидмаунт) не выполняется. И тогда у меня новый пост не загрузится.

В рендере ничего кроме рендера быть не должно. Абсолютно.

В рендере ничего кроме рендера быть не должно. Абсолютно.

Я это уже понял. Каюсь. Не понял только как решить это по-другому в моем случае.

Ну да. Я это отслеживаю на уровне функции, которая обращается к серверу. Если данные уже поступили, то она ничего не делает. Поэтому рендер происходит только два раза (один раз - первый, второй - когда поступили данные). А как более грамотно это реализовать?

ну визуальный компонент - функционально служащий для "отображения данных" - не должен (в большинстве классических подходов) самостоятельно же, эти данные запрашивать и нормализовывать (если это требуется) Произвести декомпозицию этой функциональности в компонент-контейнер или обособленную событийную шину/систему (если используется что-то типо RxJS/Redux/Saga) с которой можно установить связанность ну собственно компонент рендерить комопнент опционально - уже тогда когда данные есть. PS: в скором времени нас ждет выкатка https://reactjs.org/docs/concurrent-mode-suspense.html вот тут уже будет более стандартный "кошерный подход"

Заведи в сторе переменную с номером текущего поста и переменную поста(данных) и когда тянешь данные сохраняй их в стор. В компоненте обращайся к значению текущего поста из стора Пост пусть заного грузится по computed свойству В итоге получается, компонент меняет по клику там или еще что то, номер текущего поста, срабатывает лоадер какой то в сторе который грузит пост, на страничке появляется какой то лоадер ил опть же переменной стора (типа isLoad) данные загружаются компонент отрисовывается с новыми данными

Заведи в сторе переменную с номером текущего поста и переменную поста(данных) и когда тянешь данные сохраняй их в стор. В компоненте обращайся к значению текущего поста из стора Пост пусть заного грузится по computed свойству В итоге получается, компонент меняет по клику там или еще что то, номер текущего поста, срабатывает лоадер какой то в сторе который грузит пост, на страничке появляется какой то лоадер ил опть же переменной стора (типа isLoad) данные загружаются компонент отрисовывается с новыми данными

А эту переменную обновлять из рендера - нормально? Или тоже не следует? А если нет, то откуда ее обновлять? При переходе от оного поста к дгугомо (по раутеру), я знаю, что запускается рендер. А какие еще методы компонетна запускаются?

ну визуальный компонент - функционально служащий для "отображения данных" - не должен (в большинстве классических подходов) самостоятельно же, эти данные запрашивать и нормализовывать (если это требуется) Произвести декомпозицию этой функциональности в компонент-контейнер или обособленную событийную шину/систему (если используется что-то типо RxJS/Redux/Saga) с которой можно установить связанность ну собственно компонент рендерить комопнент опционально - уже тогда когда данные есть. PS: в скором времени нас ждет выкатка https://reactjs.org/docs/concurrent-mode-suspense.html вот тут уже будет более стандартный "кошерный подход"

мне кажется с этим подходом будет много проблем

А эту переменную обновлять из рендера - нормально? Или тоже не следует? А если нет, то откуда ее обновлять? При переходе от оного поста к дгугомо (по раутеру), я знаю, что запускается рендер. А какие еще методы компонетна запускаются?

Не понял, у тебя естькнопка или еще что то "некст пост"? Если ты ее в рендер добавишь то у тебя просто пролистаются все посты до ошибки

Не понял, у тебя естькнопка или еще что то "некст пост"? Если ты ее в рендер добавишь то у тебя просто пролистаются все посты до ошибки

Нет. Линки есть с одного поста не другой.

мне кажется с этим подходом будет много проблем

имеется в виду - про Suspense ? а какие проблемы вы представляете ? какие на этот счет соображения - где можно будет "стрелять в ногу" ?

ну вот а зачем в рендер сделай метод changePost какой то в компоненте и по клику на ссылку его вызывай, оттуда меняй текущий пост

имеется в виду - про Suspense ? а какие проблемы вы представляете ? какие на этот счет соображения - где можно будет "стрелять в ногу" ?

как минимум сейчас вижу проблему в том что если Suspense использовать только для вызовов сервисов и тд а всю логику все таки выносить из компонентов,то не совсем понятно как это должно работать,например я не везде могу сделать так что б сервис возвращал промис(например в случае с веб сокетами)

или например конвертить саги/rxjs в промисы будет тоже интересной задачей

ну вот а зачем в рендер сделай метод changePost какой то в компоненте и по клику на ссылку его вызывай, оттуда меняй текущий пост

Как-то сложно получается... У меня сейчас раутер обрабатывает все клики на линки постов. Все просто как-то...

Как-то сложно получается... У меня сейчас раутер обрабатывает все клики на линки постов. Все просто как-то...

а ну дак еще легче в компоненте в в дидмаунте сделай запрос в стор с передачей id или чего то там с параметров url, и все.

Пока данных нет лоадер какой то впили

а ну дак еще легче в компоненте в в дидмаунте сделай запрос в стор с передачей id или чего то там с параметров url, и все.

Дидмаунт вроде на запускается при переходе с одного поста на другой...

если через роутер сделано то у тебя didmoun всегда будет вызываться

щас проверю. Конструктор не запускается точно. Про дидмаунт не очень помню

Вопрос-просьба: Пытаюсь собрать Реакт-приложение с помощью Webpack и Babel. Поделитесь пожалуста основными настройками! пока что .babelrc у меня выглядит вот так: { "presets": [ "@babel/preset-env", "@babel/preset-react" ], "plugins": [ [ "@babel/plugin-proposal-class-properties" ], ["@babel/plugin-transform-runtime", { "absoluteRuntime": true, "corejs": 3, "helpers": true, "regenerator": true, "useESModules": true } ] ] }

если через роутер сделано то у тебя didmoun всегда будет вызываться

Не запускается. Только один раз он запускается. А когда переходишь на другой пост - нет.

Ну как бы и логично. Компонент то уже есть. У него только данные какие-то изменились.

Я тогда не понял, у тебя компонент поста завязан на Route c параметром?

Я тогда не понял, у тебя компонент поста завязан на Route c параметром?

А параметр уже здесь смотрю

После логина юзера в localStorage кладётся его токен, далее на фронте на каждом запросе этот токен кладётся в header запроса и на беке читается оттуда. Тут случается трабла. На первом прогрузе приложения токена нет на хедере запроса на бек, хотя токен есть в localStorage. Отчего может быть? Код в репо, приложу.

А параметр уже здесь смотрю

У меян срабатывает, я хз как у тебя не так сделано

После логина юзера в localStorage кладётся его токен, далее на фронте на каждом запросе этот токен кладётся в header запроса и на беке читается оттуда. Тут случается трабла. На первом прогрузе приложения токена нет на хедере запроса на бек, хотя токен есть в localStorage. Отчего может быть? Код в репо, приложу.

так на первом запросе нет реакт приложения, только вчера пытался рассказать это человеку, но его не пробить и нельзя токен хранить в лс https://auth0.com/docs/security/store-tokens

А то, что все говорят, что в рендере ничего нельзя делать (кроме как рендерить), это не суеверие какое-то? Все работает вроде корректно.

А то, что все говорят, что в рендере ничего нельзя делать (кроме как рендерить), это не суеверие какое-то? Все работает вроде корректно.

bad bad bad решение

А то, что все говорят, что в рендере ничего нельзя делать (кроме как рендерить), это не суеверие какое-то? Все работает вроде корректно.

нечего нельзя делать, все корректно до определенного момента

А то, что все говорят, что в рендере ничего нельзя делать (кроме как рендерить), это не суеверие какое-то? Все работает вроде корректно.

The Single Responsibility Principle

А то, что все говорят, что в рендере ничего нельзя делать (кроме как рендерить), это не суеверие какое-то? Все работает вроде корректно.

просто там настолько незначительно некорректно, что тебе кажется что корректно

Не запускается. Только один раз он запускается. А когда переходишь на другой пост - нет.

Во! Нашел. componentDidUpdate() Запускается каждый раз

Всем спасибо!!!

Во! Нашел. componentDidUpdate() Запускается каждый раз

Я не понимаю почему у тебя так

Чат подскажите если компонент привязан к роуту то его componentdidmount будет вызываться? Например posts/1 и posts/2

может кто знает как включить чтобы при запуске тестов в консоль выводилиьс дискрипшены тестов?

Чат подскажите если компонент привязан к роуту то его componentdidmount будет вызываться? Например posts/1 и posts/2

Только при первом открытии