Жесть, а нельзя vscode запретить вотчить так много? Ну, типа игнорить node_modules..

Наверное это необходимо, для постройки древовидной структуры файлов

Наверное это необходимо, для постройки древовидной структуры файлов

Да не, для дерева один раз можно прочитать. Просто майки нашли способ подгадить даже тем, кто виндой не пользуется )))

Да не, для дерева один раз можно прочитать. Просто майки нашли способ подгадить даже тем, кто виндой не пользуется )))

Хотя нет, это даже не связано с vs code, совсем

он тут не причём, короче)

Кто уже юзает хуки от redux (useDispatch, useSelector) и тестировал такие компоненты? есть пару вопросов по написанию тестов. Был бы благодарен, если бы кто-нибудь в личку отписал по этому вопросу

Привет всем. Ребята, пытаюсь написать тест с testing-library И просто закипел, может кто-то направить на путь правильный? Вот примерно такой компонент, нужно протестровать отправку файла. Загрузчик из Antd

не получается даже инпут найти в рендере модалки

не получается даже инпут найти в рендере модалки

что пробовал?

Делаю веб магазин используя карусель но в material-ui ее не нету а есть бутсрапе что выбрать. Вообще как полезно использовать готовые штуки или оучше щабросить и свои написать?

Всем привет подскажите пожалуйста почему onScroll не работает

https://codesandbox.io/s/black-wood-fp2r0

Подскажите, как получить актуальный state в event listener функции? (react hooks..) https://codesandbox.io/s/admiring-pascal-xbj6o

Всем привет подскажите пожалуйста почему onScroll не работает

потому что скроллится не тот див, на который повешен слушатель

https://codesandbox.io/s/black-wood-fp2r0

потому что скролл не происходит, сделай 10px height и overflow: scroll

потому что скролл не происходит, сделай 10px height и overflow: scroll

происходит проста я случайно обновил сниппет https://codesandbox.io/s/black-wood-fp2r0

потому что скроллится не тот див, на который повешен слушатель

я на див не повешал ничего

потому что скроллится не тот див, на который повешен слушатель

+1

я на див не повешал ничего

onScroll={this.handleScroll} это в диве, который не скроллится, скролится родитель

Подскажите, как получить актуальный state в event listener функции? (react hooks..) https://codesandbox.io/s/admiring-pascal-xbj6o

в deps добавить

onScroll={this.handleScroll} это в диве, который не скроллится, скролится родитель

огромное спасибо

в deps добавить

имеешь ввиду первый useEffect? я ожидал, что eventListener можно повесить лишь один раз..

Подскажите, как получить актуальный state в event listener функции? (react hooks..) https://codesandbox.io/s/admiring-pascal-xbj6o

у вас useEffect срабатывает только при mount/unmount, один раз. https://stackoverflow.com/questions/53845595/wrong-react-hooks-behaviour-with-event-listener вот тут написаны варианты решения вашего кейса

огромное спасибо

добавь overflow-y: scroll на .App для наглядности 😉

добавь overflow-y: scroll на .App для наглядности 😉

да я уже допер)

народ, таблица из antd на больших наборах данных (500 элементов) будет тормозить?

лучше сразу делать на react-table / virtualized или на антд будет норм с пагинацией?

А почему ошибка появилась? если ставлю props.dispatch пишет ошибку типа пропс нельзя ставить

А почему ошибка появилась? если ставлю props.dispatch пишет ошибку типа пропс нельзя ставить

потому что is not defined, props тоже is not defined

потому что is not defined, props тоже is not defined

Я думал Вы мне примерное решение дадите или скажете что именно гуглить, а то что он is not defined, это и так понятно)

Я думал Вы мне примерное решение дадите или скажете что именно гуглить, а то что он is not defined, это и так понятно)

Интерпретатор не может найти dispatch, также как и props Я не знаю где у вас находится dispatch... в конце деструктуризации допишите ...rest и посмотрите что там вообще

Интерпретатор не может найти dispatch, также как и props Я не знаю где у вас находится dispatch... в конце деструктуризации допишите ...rest и посмотрите что там вообще

Спасибо сейчас буду копать в этом направлении

А почему ошибка появилась? если ставлю props.dispatch пишет ошибку типа пропс нельзя ставить

а откуда этот диспатч должен был прийти? его нет в деструкторе пропсов вообще, диспатч нужно забандить на экшн креатор в контейнере, если я правильно понял задачу

а откуда этот диспатч должен был прийти? его нет в деструкторе пропсов вообще, диспатч нужно забандить на экшн креатор в контейнере, если я правильно понял задачу

Подскажите плз, validateForm функция, объявленная внутри фанкшнл компонента, будет пересоздаваться каждый раз? есть какие-то оптимизации внутри реакта в этой связи (кроме memo())? не нашел в доках инфы

Подскажите плз, validateForm функция, объявленная внутри фанкшнл компонента, будет пересоздаваться каждый раз? есть какие-то оптимизации внутри реакта в этой связи (кроме memo())? не нашел в доках инфы

можешь вынести её наружу компонента NoBill

это понятно) но всё-таки?

если там не используется замыкание с чем-то внутри этого компонента

даже если ты будешь использовать useCallback или useMemo, она всё равно будет пересоздаваться каждый раз, просто опеременной validateForm не будет присваиваться новое значение функции, поэтому между рендерами компонента, куда ты передаёшь эту переменную как свойство, старое и новое значение будут равны ===

и если у тебя нет проблем с перформансом от создания одной функции каждый рендер (а я думаю, что их нет), то не нужно заниматься преждевременной оптимизацией

даже если ты будешь использовать useCallback или useMemo, она всё равно будет пересоздаваться каждый раз, просто опеременной validateForm не будет присваиваться новое значение функции, поэтому между рендерами компонента, куда ты передаёшь эту переменную как свойство, старое и новое значение будут равны ===

не понял про передачуvalidateForm пропсом в рендер , она же создается внутри самого рендера как раз?

не понял про передачуvalidateForm пропсом в рендер , она же создается внутри самого рендера как раз?

ну вот у тебя компонент: let NoBill = ({ onSubmit }) => { let validateForm = event => { event.preventDefault() onSubmit() .then(() => { /* ... */ }) .catch(err => { /* ... */ }) } return ( <div> <Form validateForm={validateForm}> ... </Form> </div> ) } ты передаёшь в форму функцию validateForm как параметр. если она у тебя каждый рендер NoBill разная, то в форме каждый раз её предыдущее значение не будет равно текущему. ты можешь это "заоптимизировать": let NoBill = ({ onSubmit }) => { let validateForm = useCallback(event => { event.preventDefault() onSubmit() .then(() => { /* ... */ }) .catch(err => { /* ... */ }) }, [ onSubmit ]) return ( <div> <Form validateForm={validateForm}> ... </Form> </div> ) } теперь у тебя есть гарантия, что если onSubmit не меняется, то не изменится и значение validateForm, поэтому гипотетически внутри компонента формы проп validateForm не будет меняться и форма не будет перерендериваться. но отвечая на твой вопрос «будет ли она пересоздаваться каждый раз» — да, пересоздаваться каждый раз будет, но переприсваиваться — нет.

понятно, спасибо

Парни, хэлп ми плиз. Пишу апликуху на реакте. Структура данных по мере написания разрастается и код в reducer-е становится похож на чью-то блевотню. Потому-что 5 объектов каждый из которых имеет по 2-4 уровня вложенности - ну это перебор. Особенно если нужно поменять поменять верхний пропс (ну например флажок, dataLoaded)

Я вот щас почитал про reducerCombining. Оно мне поможет?

а у тебя один редьюсер на все приложение?

Ну да. Я ж не гуру

ну только вот это основы

В вопросе выше уже ответ дали

ну только вот это основы

+

Парни, хэлп ми плиз. Пишу апликуху на реакте. Структура данных по мере написания разрастается и код в reducer-е становится похож на чью-то блевотню. Потому-что 5 объектов каждый из которых имеет по 2-4 уровня вложенности - ну это перебор. Особенно если нужно поменять поменять верхний пропс (ну например флажок, dataLoaded)

не должно быть такой вложенности вообще

не должно быть такой вложенности вообще

почему?

можешь свой кейс привести

или в редаксе редьюсеры вниз не комбайнятся? 🧐

Вложенности в 2-3 уровня мне потенциально не избежать. Но так да, поэтому и спрашиваю. Значит комбайны, спасибо.

Ну да. Я ж не гуру

Даже в документации есть примеры, как организовывать редьюсеры

добрый вечер, можете подсказать, наверно глупый вопрос. в React Function Component - не могу создать поле для записи числа, state - не нужен - рендерить ничего не нужно если пишу const - то он не изменяемый, а let или var - из дочерних функций не видно те что я объявил в самой компоненте вначале, подскажите что я не так делаю? смысл что есть функция которая устанавливает currentid - у компонента <select option> - на событие onChange

есть библиотека React-hotkeys с хоком withHotKeys. Он пробрасывает пропс hotKeys в компоненту. Так вот, как выглядит тип у этого пропса HotKeys?

Даже в документации есть примеры, как организовывать редьюсеры

Я вообще бэкендщик так-то. И у нас основная система - это коробка. Раньше кастомных вьюхи вообще пилились на jquery под неё от подрядчика. Либо aspx страничка возвращалась. Но нам удалось убедить всех, что реакт - это хорошо. Так что вот осваиваемся. Еще раз спасибо.

Я вообще бэкендщик так-то. И у нас основная система - это коробка. Раньше кастомных вьюхи вообще пилились на jquery под неё от подрядчика. Либо aspx страничка возвращалась. Но нам удалось убедить всех, что реакт - это хорошо. Так что вот осваиваемся. Еще раз спасибо.

Короче понятно, натурал, непонятно как к нам зашел. 😊

Через задний проход 😂

Ну дык. Скорость доработки функционала после ввода реакт выросла. Бизнес свои свистоперделки быстрее стал получать. А то пойди разбери миниапп написанный на jquery. Прям радует возможность допилить какой-то компонент к и связки к нему и не морочить я над роботой остального куска. И сразу ясно, что перепиливать. Красота же

Через задний проход 😂

с бекенда

Ну

Ну дык. Скорость доработки функционала после ввода реакт выросла. Бизнес свои свистоперделки быстрее стал получать. А то пойди разбери миниапп написанный на jquery. Прям радует возможность допилить какой-то компонент к и связки к нему и не морочить я над роботой остального куска. И сразу ясно, что перепиливать. Красота же

Почему не ангуляр, кстати?

Тогда ещё вопрос. Состояние из редьюсера через getderivedstate - это правильно?

@Atassis ↑ Шутки за 300, угомонить бы их

Тогда ещё вопрос. Состояние из редьюсера через getderivedstate - это правильно?

скорее нет, чем да, через connet и mapstatetoprops каноничнее

@ilyabykov Andrey го без заднепроходных шуток

На будущее

mssg.ru - новый способ развода?

скорее нет, чем да, через connet и mapstatetoprops каноничнее

Не, ну это я и так сделал. Но у меня есть state в компоненте, который определяется в зависимости от значения state-a в store. Включать сам state в стор не хочется, потому что этот стейт с бизнес-данными не связан напрямую, плюс меняется редко.

ребят. есть паблик такой же только по salesforce. и может кто-нибудь шарит в нем?

halp. у меня есть блок Controls. там есть слева выбор элемента, а справа две кнопки - добавление и удаление. как назвать правый блок?

halp. у меня есть блок Controls. там есть слева выбор элемента, а справа две кнопки - добавление и удаление. как назвать правый блок?

Actions?

Actions?

получается какой-то синоним к controls

получается какой-то синоним к controls

значит это не контролс

значит это не контролс

не, ну, сам блок (общий) он как бы с кнопками. там есть выбор элемента с который потом будет работать юзер, а есть ещё две кнопки (save, remove). и что это если не controls?

Ребята

Давайте жить дружно