мб файл с таким названием?

с пробелом?

хм

https://www.npmjs.com/package/babel-plugin-bem-import

https://www.npmjs.com/package/babel-plugin-bem-import

нууу яснапанятна

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

(т.к. докладчик сказал что это по спеке ?)

здесь про саму нотацию https://www.npmjs.com/package/@bem/import-notation

Всем привет. Никто случайно не знает как можно в реакт-роутере указать обработку ссылок типа "/domain/..../:param1/:param2" Тут "..." любой набор символов, но в конце всегда :param2, а начало с "/domain/"

или ток регэкспом?

/domain/(.*)/:param1/:param2

мб сработает

sc лучше

Подскажите пожалуйста, а как в компонент по типу styled.div"some styles" положить какой-то контент? Ведь в классическом react в render кладётся разметка, а где она в styled-components? Роюсь в доках и пока не нахожу. Спасибо.

Кто знает, c вебпаком 4, нужно юзать вебпак-дев-сервер 3?

Всем привет. Никто случайно не знает как можно в реакт-роутере указать обработку ссылок типа "/domain/..../:param1/:param2" Тут "..." любой набор символов, но в конце всегда :param2, а начало с "/domain/"

/domain/(.*)/:param1/:param2 сработал

Подскажите пожалуйста, а как в компонент по типу styled.div"some styles" положить какой-то контент? Ведь в классическом react в render кладётся разметка, а где она в styled-components? Роюсь в доках и пока не нахожу. Спасибо.

ээээ const Comp = styled.div`` <Comp>контент</Comp>

/domain/(.*)/:param1/:param2 сработал

спс ?

А что на счёт архитектуры типа components -> some-component -> index.jsx ? Насколько плоха такая затея. Я уже чувствую её неудобства, потому что к some-component могут относится несколько дочерних "тупых" компонентов.

условно у тебя есть фича, например модалка. для нее отдельная папка, в ней компоненты - в своих папках, что бы удобно было тесты добавить и все необходимое. components/modal - modal —- index.js - backdrop —- index.js - index.js и этот index.js в корне modal экспортирует все что тебе надо, например import Modal from './modal'; import Backdrop from './backdrop'; export { Modal as AwesomeModal, Backdrop } в другом компоненте: import { AwesomeModal } from 'components/modal';

нууу яснапанятна

?????

Модалка не фича

Модалка не фича

это набор компонентов для решения одной задачи, чем не фича?

Ответ на свой вопрос по styled-components нашел здесь - https://www.styled-components.com/docs/advanced#referring-to-other-components

Друзья, подскажите, как правильно потом динамически скрипты подкгружать, после того, как я при помощи webpack разбил скрипт на chunks? Прямо из кода, типа loadScript или есть какое-то специальное решение?

Друзья, подскажите, как правильно потом динамически скрипты подкгружать, после того, как я при помощи webpack разбил скрипт на chunks? Прямо из кода, типа loadScript или есть какое-то специальное решение?

import()

Ещё вопросик. Чтобы в компоненте указать место для рендеринга дочерних компонентов, есть children. Но как при этом, получить props переданные в текущий компонент? Поясню, есть код: export const MenuWrapper = function ({children}) { return <ul>{children}</ul> }; Как в этом компоненте, достать props переданные в него непосредственно? Спасибо.

import()

Да, верно. Спасибо!

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

Есть props.children, т.е. разобрался. Спасибо.

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

Я знаю про динамические импорты. Просто переклинило, почему-то, не понял сразу, что они и являются подгрузкой кода. Казалось, что нужно как-то заимпортить файлы

Проверил - все работает

Проверил - все работает

в скрине был нюанс - import вызывался сразу и присваивался переменной, то есть уже в этот момент пошла загрузка, для большего контроля лучше присваивать фунции, типа const load = () => import('./...'); load().then(() => ...); если будешь делать универсальный компонент для ленивой подгрузки компонентов, в него в любом случае придется передавать функцию, что бы до componentDidMount промис не стартовал

Хм. Чот странное творится. Есть один компонент, в котором, в зависимости от каких-то условий, рендерятся несколько других компонентов. ЧТо-то вроде <> { case1 && <Elem1/> } { case2 && <Elem2/> } { case3 && <Elem3/> } </> И при этом в <Elem3>, в котором нет стейта, и который представляет из себя тупо див с текстом, возникает ошибка посла анмаунта Warning: Can only update a mounted or mounting component. This usually means you called setState, replaceState, or forceUpdate on an unmounted component. This is a no-op. WTF? Кто-нибудь сталкивался с таким?

может у тебя в onClick ниже передается функция которая пытается setState сделать ?

У меня нет онкликов там

И в Elem3 ничего не передаётся

Хм. Чот странное творится. Есть один компонент, в котором, в зависимости от каких-то условий, рендерятся несколько других компонентов. ЧТо-то вроде <> { case1 && <Elem1/> } { case2 && <Elem2/> } { case3 && <Elem3/> } </> И при этом в <Elem3>, в котором нет стейта, и который представляет из себя тупо див с текстом, возникает ошибка посла анмаунта Warning: Can only update a mounted or mounting component. This usually means you called setState, replaceState, or forceUpdate on an unmounted component. This is a no-op. WTF? Кто-нибудь сталкивался с таким?

Это в проде?

Это в проде?

нет

Мб хот лоадер, хз

В продбилде эти варнинги режутся

Мб хот лоадер, хз

хм. У меня 4 бета 21

А что тогда работает со стейтом?

в CWRP рутового компонента есть функция, которая диспатчит ивент, который изменяет, скажем, activeClientId в сторе и на основе этого ACI беру какой-нибудь объект, который получаю в рутовом компоненте как пропс. И, в зависимости от его состояния (есть/нет) рендерится Elem3

Но это не стейт

И стета вообще нет

Лол. Почнилось обновление версии RHL до 4.0.0-beta.22

Лол. Почнилось обновление версии RHL до 4.0.0-beta.22

Там работало на 19 бете - потом сломалось и починили на 22

17:03:03.021 index.js:2178 Warning: A component is changing an uncontrolled input of type checkbox to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. вот что выдает консоль теперь может кто то понимает как именно мне надо решать эту проблему?

как правильно сделать логику отображения разных элементов посредством переключения кнопки radio изначально эта кнопка привязана к состоянию компонента и стоит в false отображая дефотную информацию как только она нажимается я хочу менять информацию(парвильнее сказать менять отрисовываемый компонент) мне надо сделать условия if(this.state.chekedA === true) { тут надо сделать компонент который принимает в себя состояние кнопки и внутри себя рисует как надо или можно сделать рисование разных компонентов в этом же return } ?

может я что то в корне не правильно делаю, так как сейчас начал выводить состоянии в консоль лог и получаю следующее false Proxy {dispatchConfig: null, _targetInst: null, …}

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

Там работало на 19 бете - потом сломалось и починили на 22

le classique

Что забавно на стабильной версии у меня вообще всё разваливается

Лол. Почнилось обновление версии RHL до 4.0.0-beta.22

Зачем тебе rhl? Webpack hot middleware же есть

Он хотя бы нормально работает

Зачем тебе rhl? Webpack hot middleware же есть

Потому что это не мой личный проект, его начинали писать до меня, и надо фичи пилить, а не хотлоадерами заниматься. У себя ч wdm прикручиваю

парни кто использует react + es5 + webpack ?

Казалось бы, какие проблемы могут возникнуть?

вебпак

loader option has been deprecated - replace with "use" events.js:183 throw er; // Unhandled 'error' event ^

@webpack_ru

там же написано

ты наверно лоадеры через ! используешь

может кто-ниюудь скинуть свои rules раздел вебпака

ребят, а можно ли html(файл 1000+ строк) обернуть в iframe например, и отрендерить? так как переписывать на реакт все - боль

ребят, а можно ли html(файл 1000+ строк) обернуть в iframe например, и отрендерить? так как переписывать на реакт все - боль

Ну что за дичь

Садись и пиши

Переписывать на реакт html? Ты имеешь ввиду на jsx, не думаю что долго (class на className), зато вставишь тупым компонентом и усё.

у меня к этому файлу есть файл еще js (8000 строк)

и как бы переписывать все, не вариант

Ну так не переписывай

ребят, а можно ли html(файл 1000+ строк) обернуть в iframe например, и отрендерить? так как переписывать на реакт все - боль

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

ребят, а можно ли html(файл 1000+ строк) обернуть в iframe например, и отрендерить? так как переписывать на реакт все - боль

Можно, разрешаю, только не оффтопь здесь

Я так понимаю, твоя задача чтобы в React приложении был компонент с типа jQuery говнокодом? Ну так и делай, раз ты на это осознанно идешь))

парни, как понять refs?

ребят, возникла проблема - внутренний компонент не ререндертся после обновления стейта. В дев тулзе стейт меняется нормально, бьюсь с проблемой и не могу найти решения https://gist.github.com/web-worddoc/7c1a379c1f28eb18e140ab5620f620b7

pdf js, просто не вижу нормального модуля для реакта

какой плагин для сжатия используете в проекте ?

Ребята, всем привет. Может кто то сталкивался с формой загрузки файла на react JS. Как это там реализовано и что лучше использовать?

Всем привет. Народ, а для автокмплита в поле ввода с динамической подгрузкой данных из базы кто что использует? Какой компонент? Желательно в связке react+redux

ребят, возникла проблема - внутренний компонент не ререндертся после обновления стейта. В дев тулзе стейт меняется нормально, бьюсь с проблемой и не могу найти решения https://gist.github.com/web-worddoc/7c1a379c1f28eb18e140ab5620f620b7

у тебя как минимум в constructor не хватает .bind(this) для каждого метода

у тебя как минимум в constructor не хватает .bind(this) для каждого метода

Так в главном компонента bind есть

методы же меняют стейт главного компонента

Так в главном компонента bind есть

а зачем ты тогда заново присваивание делаешь? просто используй их и всё

а зачем ты тогда заново присваивание делаешь? просто используй их и всё

ну это я так, чтобы код короче был в рендере

ну это я так, чтобы код короче был в рендере

если б ты codepen сделал, было бы проще, конечно )

если б ты codepen сделал, было бы проще, конечно )

а я пробовал, там компоненты вообще не рендерятся

codesandbox

сейчас выложу туда

у тебя как минимум в constructor не хватает .bind(this) для каждого метода

arrow function, .bind(this) не красиво, засоряет код, сложно читабелен без обид )

arrow function, .bind(this) не красиво, засоряет код, сложно читабелен без обид )

на вкус и цвет. и в больших контейнерах очень упрощает рефакторинг

arrow function, .bind(this) не красиво, засоряет код, сложно читабелен без обид )

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

а я пробовал, там компоненты вообще не рендерятся

так, а в чем проблема? если убрать лишние bind для отсутствующих методов и передать в Form people, то всё работает вроде

я обновил гист