пробовала все возможные, но на скрол ругается

пробовала все возможные, но на скрол ругается

у меня картинка размыта

у меня функционал работает, в консоль выводила, это дом-элемент - ul но у меня как тип задан any, а мне нужно другой задать, который соответствует ref

так это больше похоже на проблему с TypeScript. Я кроме any ничего посоветовать не могу )))

у меня картинка размыта

это гифка вапщето

так это больше похоже на проблему с TypeScript. Я кроме any ничего посоветовать не могу )))

c any все ок)

лид не принимает

чтобы any вообще не было

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

но но но, он и так мне помагает)

у меня функционал работает, в консоль выводила, это дом-элемент - ul но у меня как тип задан any, а мне нужно другой задать, который соответствует ref

а HTMLLIElement пробовали?

а HTMLLIElement пробовали?

решили, спасибо!

надо было убрать колбек

надо было убрать колбек

Можно Поподробнее ?

вместо этого ref={(node) => this._refList = node написать ref={ this._refList } ну и current добавить

Ребят, так можно собрать компоненты в массив и перебирать их как-то или нет?

да

можно

вместо этого ref={(node) => this._refList = node написать ref={ this._refList } ну и current добавить

аа, ёмоё. Это ещё называется "надо было заглянуть в документацию")

можно

а подскажите по синтаксису, может есть пример под рукой?

а подскажите по синтаксису, может есть пример под рукой?

покажи что нужно

аа, ёмоё. Это ещё называется "надо было заглянуть в документацию")

😂

Затуп. Есть <Card>, а внутри кард может быть <Content1 /> или <C2 /> или <C3 /> и т.д. Компоненты с контентом со своей версткой, функциями и миром (данными из стора напрямую), но в него передаются локальные состояния и функции компонента Card тоже. То есть сейчас это <CardWrapper> <Content1 onClick={someFunc} param={someParam}/> </ CardWrapper> Я не хочу копипастить эту бороду для каждого контента. Как бы так записать чтобы динамически туда вставлять нужный компонент контента. Или маппировать компоненты. Вроде было очевидное решение, которое от меня ускользает. Хелп Т_Т

@valera_horsharik вот к этому вопросу

)

у меня еще есть такое с ref, хочешь?

Подскажите react-scripts надо в devDep или просто в dep кидать в package,json?

Затуп. Есть <Card>, а внутри кард может быть <Content1 /> или <C2 /> или <C3 /> и т.д. Компоненты с контентом со своей версткой, функциями и миром (данными из стора напрямую), но в него передаются локальные состояния и функции компонента Card тоже. То есть сейчас это <CardWrapper> <Content1 onClick={someFunc} param={someParam}/> </ CardWrapper> Я не хочу копипастить эту бороду для каждого контента. Как бы так записать чтобы динамически туда вставлять нужный компонент контента. Или маппировать компоненты. Вроде было очевидное решение, которое от меня ускользает. Хелп Т_Т

в чем проблема просто промапить это?

@valera_horsharik вот к этому вопросу

гуглим dynamic component name

3й вопрос уже за сегодня ))

Подскажите react-scripts надо в devDep или просто в dep кидать в package,json?

если в npm публиковать не будете, то без разницы куда. а вообще в devDep

если в npm публиковать не будете, то без разницы куда. а вообще в devDep

Спасибо, не знал что вся эта кутерьма только для npm пакетов...

гуглим dynamic component name

вот оно. Спасибо 🙂 помню ж было очевидное решение

Затуп. Есть <Card>, а внутри кард может быть <Content1 /> или <C2 /> или <C3 /> и т.д. Компоненты с контентом со своей версткой, функциями и миром (данными из стора напрямую), но в него передаются локальные состояния и функции компонента Card тоже. То есть сейчас это <CardWrapper> <Content1 onClick={someFunc} param={someParam}/> </ CardWrapper> Я не хочу копипастить эту бороду для каждого контента. Как бы так записать чтобы динамически туда вставлять нужный компонент контента. Или маппировать компоненты. Вроде было очевидное решение, которое от меня ускользает. Хелп Т_Т

может let ContentToUse = (theStarsHaveAligned ? Content1 : Content2); <CardWrapper> <ContentToUse onClick={someFunc} param={someParam}/> </ CardWrapper> например

может let ContentToUse = (theStarsHaveAligned ? Content1 : Content2); <CardWrapper> <ContentToUse onClick={someFunc} param={someParam}/> </ CardWrapper> например

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

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

а почему имя, а не сам компонент?

потому что параметры родителя общие

потому что параметры родителя общие

можешь показать на твоём примере, че-то не понял проблему

Допустим в <Card> лежит локальная логика, useState, тогглеры и т.д. они передадутся всем компонентам, но кому именно сейчас не известно и решаться будет не в Card, а уровнями выше. То есть в Card прилетает параметр имя, и внутри кард уже автоматически разруливается какой именно ребенок-компонент будет. Если компонентов штук 20, то проверка явно не красивая. С тернарным да все ок

попахивает пис... оверинжинирингом

😄 да ладно, как там “если вы копипастите код пора переписывать"

😄 да ладно, как там “если вы копипастите код пора переписывать"

пора почитать про DRY

Допустим в <Card> лежит локальная логика, useState, тогглеры и т.д. они передадутся всем компонентам, но кому именно сейчас не известно и решаться будет не в Card, а уровнями выше. То есть в Card прилетает параметр имя, и внутри кард уже автоматически разруливается какой именно ребенок-компонент будет. Если компонентов штук 20, то проверка явно не красивая. С тернарным да все ок

типа огромного контейнера?:) где вся логика и в нем рендер компонентов уже и прокидывания туда пропсов с родителя?)

А нет, это другое что-то у вас 🤔

Допустим в <Card> лежит локальная логика, useState, тогглеры и т.д. они передадутся всем компонентам, но кому именно сейчас не известно и решаться будет не в Card, а уровнями выше. То есть в Card прилетает параметр имя, и внутри кард уже автоматически разруливается какой именно ребенок-компонент будет. Если компонентов штук 20, то проверка явно не красивая. С тернарным да все ок

объект-маппер и все. даже проверки в рендере никакие не нужны

но вообще это плохо пахнет конечно

пора почитать про DRY

ну вот я про это. Попробую с динамиком, пока выглядит лучше чем то что есть

Ребята, недавно я написал статью о том, как использовать шаблон BLoC с React. Шаблон стал альтернативой управлению состояниями во Flutter, поэтому я попытался привнести опыт разработки в React с использованием RxJS. Если вы хотите посмотреть: https://medium.com/dailyjs/introducing-bloc-pattern-with-react-and-rxjs-40109665bb2

гайс, как элегенатно вытащить цвет из palette(prop('color') и если его нет то просто взять из prop('color') в SC? <Text color="red" , если есть в палитре оттуда и если нет, оставь как есть

Ребята, недавно я написал статью о том, как использовать шаблон BLoC с React. Шаблон стал альтернативой управлению состояниями во Flutter, поэтому я попытался привнести опыт разработки в React с использованием RxJS. Если вы хотите посмотреть: https://medium.com/dailyjs/introducing-bloc-pattern-with-react-and-rxjs-40109665bb2

обычный компонент контейнер с рендер пропсами

обычный компонент контейнер с рендер пропсами

пацан к мечте шел

Ребята, недавно я написал статью о том, как использовать шаблон BLoC с React. Шаблон стал альтернативой управлению состояниями во Flutter, поэтому я попытался привнести опыт разработки в React с использованием RxJS. Если вы хотите посмотреть: https://medium.com/dailyjs/introducing-bloc-pattern-with-react-and-rxjs-40109665bb2

ещё бы export default не продвигать на каждый чих

и пройтись по примерам линтером + преттиер

в итоге профитность непонятна

Допустим в <Card> лежит локальная логика, useState, тогглеры и т.д. они передадутся всем компонентам, но кому именно сейчас не известно и решаться будет не в Card, а уровнями выше. То есть в Card прилетает параметр имя, и внутри кард уже автоматически разруливается какой именно ребенок-компонент будет. Если компонентов штук 20, то проверка явно не красивая. С тернарным да все ок

ну это ты описываешь детали выбора компонента, которые я условно отразил в строчке let ContentToUse = (theStarsHaveAligned ? Content1 : Content2); Тут может быть и не тернарка, а например объект "ключ":компонент, а из родителя передаётся ключ, так находится компонент. В любом случае одного имени недостаточно, по-моему, нужно ещё сами компоненты перечислить: получить нужно всё равно сам компонент (функцию), а как получить функцию имея только её имя в виде строки? Разве только через eval), или может ещё как, я не в курсе. (window[function_name] вроде для классов,а также let,const не работает)

объект-маппер и все. даже проверки в рендере никакие не нужны

+

ну вот я про это. Попробую с динамиком, пока выглядит лучше чем то что есть

покажи, как в итоге сделала

встройку в JSX не могла врубить как сделать. Да прям как в статье и сделала. Если у вас есть классные примеры без динамических тегов — киньте в меня пожалуйста

встройку в JSX не могла врубить как сделать. Да прям как в статье и сделала. Если у вас есть классные примеры без динамических тегов — киньте в меня пожалуйста

в какой статье-то? скинь

гуглим dynamic component name

@iv_ov Например https://medium.com/@Carmichaelize/dynamic-tag-names-in-react-and-jsx-17e366a684e9

грациас

Ребят, подскажите, как можно запустить метод только после того, как несколько ajax запросов завершатся? В голову приходит promise all, но каждый запрос выполняется отдельно в отдельной саге (redux-saga)

в google-map-react ты почти напрямую с Google Maps API взаимодействуешь. Минимум надстроек

Насчет google-map-react, есть что на гитхаб посмотреть из читабельных кейсов?

привет, ребята! Кто работал с normalizr? можете помочь? не могу задать правильно схему для денормализации. надо на выходе получить { "tasksById": [ { "id": 1, "taskName": "Task 1", "taskStart": 3, "taskDuration": 7, "cellColor": "red" }, { "id": 2, "taskName": "Task 2", "taskStart": 1, "taskDuration": 9, "cellColor": "blue" }, { "id": 3, "taskName": "Task 3", "taskStart": 4, "taskDuration": 4, "cellColor": "green" }, { "id": 4, "taskName": "Task 4", "taskStart": 3, "taskDuration": 7, "cellColor": "yellow" }, { "id": 5, "taskName": "Task 5", "taskStart": 1, "taskDuration": 5, "cellColor": "purple" }, { "id": 6, "taskName": "Task 6", "taskStart": 2, "taskDuration": 9, "cellColor": "orange" }, { "id": 7, "taskName": "Task 7", "taskStart": 4, "taskDuration": 3, "cellColor": "grey" }, { "id": 8, "taskName": "Task 8", "taskStart": 3, "taskDuration": 7, "cellColor": "blue" }, { "id": 9, "taskName": "Task 9", "taskStart": 6, "taskDuration": 2, "cellColor": "cyan" }, { "id": 10, "taskName": "Task 10", "taskStart": 2, "taskDuration": 8, "cellColor": "red" } ] }

а я получаю:

[ { "id": 1, "taskName": "Task 1", "taskStart": 3, "taskDuration": 7, "cellColor": "red" }, { "id": 2, "taskName": "Task 2", "taskStart": 1, "taskDuration": 9, "cellColor": "blue" }, { "id": 3, "taskName": "Task 3", "taskStart": 4, "taskDuration": 4, "cellColor": "green" }, { "id": 4, "taskName": "Task 4", "taskStart": 3, "taskDuration": 7, "cellColor": "yellow" }, { "id": 5, "taskName": "Task 5", "taskStart": 1, "taskDuration": 5, "cellColor": "purple" }, { "id": 6, "taskName": "Task 6", "taskStart": 2, "taskDuration": 9, "cellColor": "orange" }, { "id": 7, "taskName": "Task 7", "taskStart": 4, "taskDuration": 3, "cellColor": "grey" }, { "id": 8, "taskName": "Task 8", "taskStart": 3, "taskDuration": 7, "cellColor": "blue" }, { "id": 9, "taskName": "Task 9", "taskStart": 6, "taskDuration": 2, "cellColor": "cyan" }, { "id": 10, "taskName": "Task 10", "taskStart": 2, "taskDuration": 8, "cellColor": "red" }, { "tasksById": [ { "id": 1, "taskName": "Task 1", "taskStart": 3, "taskDuration": 7, "cellColor": "red" }, { "id": 2, "taskName": "Task 2", "taskStart": 1, "taskDuration": 9, "cellColor": "blue" }, { "id": 3, "taskName": "Task 3", "taskStart": 4, "taskDuration": 3, "cellColor": "green" }, { "id": 4, "taskName": "Task 4", "taskStart": 3, "taskDuration": 7, "cellColor": "yellow" }, { "id": 5, "taskName": "Task 5", "taskStart": 1, "taskDuration": 5, "cellColor": "purple" }, { "id": 6, "taskName": "Task 6", "taskStart": 2, "taskDuration": 9, "cellColor": "orange" }, { "id": 7, "taskName": "Task 7", "taskStart": 4, "taskDuration": 3, "cellColor": "grey" }, { "id": 8, "taskName": "Task 8", "taskStart": 3, "taskDuration": 7, "cellColor": "blue" }, { "id": 9, "taskName": "Task 9", "taskStart": 6, "taskDuration": 2, "cellColor": "cyan" }, { "id": 10, "taskName": "Task 10", "taskStart": 2, "taskDuration": 8, "cellColor": "red" } ], "id": 11 } ]

вот так задаю свою схему и делаю денормализацию const task = new schema.Entity("tasksById"); const myDenormSchema = { tasksById : [task]}; const entities = data; console.log("entities " + entities); const denormalizedData = denormalize( { tasksById: [1,2,3,4,5,6,7,8,9,10]}, myDenormSchema, entities );

Что так мало тасков давай еще 100

сори

вот так задаю свою схему и делаю денормализацию const task = new schema.Entity("tasksById"); const myDenormSchema = { tasksById : [task]}; const entities = data; console.log("entities " + entities); const denormalizedData = denormalize( { tasksById: [1,2,3,4,5,6,7,8,9,10]}, myDenormSchema, entities );

Средствами es6 нельзя решить проблему?

@pravosleva например? мне нужно используя normalizr

@pravosleva например? мне нужно используя normalizr

Просто нормалайзер ради нормалайзера?

Насчет google-map-react, есть что на гитхаб посмотреть из читабельных кейсов?

неа

Просто нормалайзер ради нормалайзера?

ну как сказать.. просто хочу попробовать сделать денормализацию данных так

ну как сказать.. просто хочу попробовать сделать денормализацию данных так

а вы уверены, что понимаете зачем и что такое нормальная форма данных?

Добрый день ! Подскажите пожалуйста. Будет работать так tree shaking ? Когда я импортирую только auth ? если я с начало . services/auth.js export default function auth() {…} services/service.js export default function service() {…} services/index.js export { default } from './auth'; export { default } from ‘./service’; App.js import { auth } from ./services;

привет, ребята! Кто работал с normalizr? можете помочь? не могу задать правильно схему для денормализации. надо на выходе получить { "tasksById": [ { "id": 1, "taskName": "Task 1", "taskStart": 3, "taskDuration": 7, "cellColor": "red" }, { "id": 2, "taskName": "Task 2", "taskStart": 1, "taskDuration": 9, "cellColor": "blue" }, { "id": 3, "taskName": "Task 3", "taskStart": 4, "taskDuration": 4, "cellColor": "green" }, { "id": 4, "taskName": "Task 4", "taskStart": 3, "taskDuration": 7, "cellColor": "yellow" }, { "id": 5, "taskName": "Task 5", "taskStart": 1, "taskDuration": 5, "cellColor": "purple" }, { "id": 6, "taskName": "Task 6", "taskStart": 2, "taskDuration": 9, "cellColor": "orange" }, { "id": 7, "taskName": "Task 7", "taskStart": 4, "taskDuration": 3, "cellColor": "grey" }, { "id": 8, "taskName": "Task 8", "taskStart": 3, "taskDuration": 7, "cellColor": "blue" }, { "id": 9, "taskName": "Task 9", "taskStart": 6, "taskDuration": 2, "cellColor": "cyan" }, { "id": 10, "taskName": "Task 10", "taskStart": 2, "taskDuration": 8, "cellColor": "red" } ] }

юзайте gist ради бога

Добрый день ! Подскажите пожалуйста. Будет работать так tree shaking ? Когда я импортирую только auth ? если я с начало . services/auth.js export default function auth() {…} services/service.js export default function service() {…} services/index.js export { default } from './auth'; export { default } from ‘./service’; App.js import { auth } from ./services;

версия бабеля и вебпука?

версия бабеля и вебпука?

последняя

ребята, ну не судите строго, я просто учусь, разбираюсь только

тогда должно быть все ок, только если это не либа. Там свои проблемы. Но это не точно