@react_js - страница 1242 - Telegram web archive

Arczi

Кто если не он!

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

Danila

mobx, unstated, effector

Alexey

а так ради интереса что если не использовать редукс как тогда

hoc

Sergey

а так ради интереса что если не использовать редукс как тогда

Reatom, Effector

Андрей

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

А что ты предлагаешь?

Arczi

А что ты предлагаешь?

выше написали 👆🏽👆🏽

Андрей

выше написали 👆🏽👆🏽

В таком случае разницы нет большое приложение или нет. Редакс не нужно использовать.

Arczi

В таком случае разницы нет большое приложение или нет. Редакс не нужно использовать.

я имел ввиду что приложение не обязательно должно юзать редкс только если есть необходимость а авторизацию пракстически всегда делаешь

Viachaslau

Всем привет) вопрос больше по ts, чем реакту, но может кто подскажет) гуглил, но не нашел похожих вариантов. Ситуация такая, что есть объект { a: { b: string, ... }, c: { d: string, ... } .... } и надо создать тип, который будет выглядеть как "a.b" | "c.d" | ... и тд Может кто-нибудь сталкивался с такой задачкой? скиньте где почитать или пример какой) Спасибо

Andrii

Народ, привет, а нормальная ли это практика хранить методы в React Context? Методы авторизации, к примеру. Или пилить useReducer уже и вызывать методы в редьюсере?

King

Всем привет, при использовании нескольких error boundary на разных уровнях, и к примеру если ошибку ловит нижний, то чтобы он дошел до верхнего нужно снова бросать ошибку?

King

кто-как это реализует?

Margarita

Всем привет) Есть два приложения, личный кабинет, который был написан как cra приложение и публичный раздел на next. У них есть общие элементы, типа хэдер, футер, меню и тд, которые сейчас вставлены копипастой. Как можно хранить и импортировать эти общие элементы, чтобы не надо было изменения два раза производить? Первое, что пришло в голову - это npm модуль, но довольно странно там хранить вещи типа футера (не очень абстрактно).

Ilya

Всем привет) Есть два приложения, личный кабинет, который был написан как cra приложение и публичный раздел на next. У них есть общие элементы, типа хэдер, футер, меню и тд, которые сейчас вставлены копипастой. Как можно хранить и импортировать эти общие элементы, чтобы не надо было изменения два раза производить? Первое, что пришло в голову - это npm модуль, но довольно странно там хранить вещи типа футера (не очень абстрактно).

git submodules

Nikolai

Всем привет) Есть два приложения, личный кабинет, который был написан как cra приложение и публичный раздел на next. У них есть общие элементы, типа хэдер, футер, меню и тд, которые сейчас вставлены копипастой. Как можно хранить и импортировать эти общие элементы, чтобы не надо было изменения два раза производить? Первое, что пришло в голову - это npm модуль, но довольно странно там хранить вещи типа футера (не очень абстрактно).

Вынести в отдельный репозиторий общие компоненты

Margarita

спасибо, пойду гуглить в этом направлении

Ilya

git submodules

выделяете ваши компоненты в отдельный репозиторий - а потом его подключаете как git submodule в каждый из проектов с которыми разделяется функциональность, прелесть сабмодулей, так же и в том, что для каждого проекта который будет использовать сабмодуль -можно установить конкретную ревизию которая будет использоваться - не обязательно оба проекта держать на HEAD сабмодуля - т.е. один проект может использовать легаси версию, в то время как другой - уже быть отрефакторенным и использовать более мажорную функциональность из этого сабмодуля, в то время как в нем самом HEAD еще выше и там активно пилятся новые фичи

Dmitry

Друзья, есть ли аналоги heroku/now но чтобы серверы в России?

Vladimir

Друзья, есть ли аналоги heroku/now но чтобы серверы в России?

яндекс облако (сам не пользовался)

Kostya

всем привет раз испольщую реакт-бутстрап. Создал такой компонент вот его рендер! class NW extends React.Component { render() { let { list } = this.props return ( <div> <Carousel >{ list.map(({ _id, ...props }) => ( <Service key={_id} {...props} /> )) }</Carousel> </div> ) } componentDidMount() { this.props.load() } } В документации написано что там адекватные пропсы по умолчанию! Но умя item-index=0(первый слайд) не выводится! Посмотрел в бразере его класс имеет`display: none`

Георгий

Новичек в реакте, немного запутался, что же тут в приоритете ооп или фп? Сначала я думал, что однозначно фп, js же все же, но проходя курсы и дойдя до state, вижу все больше и больше именно классов. Так в чем же дело??

Ivan

всем привет раз испольщую реакт-бутстрап. Создал такой компонент вот его рендер! class NW extends React.Component { render() { let { list } = this.props return ( <div> <Carousel >{ list.map(({ _id, ...props }) => ( <Service key={_id} {...props} /> )) }</Carousel> </div> ) } componentDidMount() { this.props.load() } } В документации написано что там адекватные пропсы по умолчанию! Но умя item-index=0(первый слайд) не выводится! Посмотрел в бразере его класс имеет`display: none`

демку собери

Rrr

Новичек в реакте, немного запутался, что же тут в приоритете ооп или фп? Сначала я думал, что однозначно фп, js же все же, но проходя курсы и дойдя до state, вижу все больше и больше именно классов. Так в чем же дело??

старые значит туториалы и курсы :)

Ivan

Новичек в реакте, немного запутался, что же тут в приоритете ооп или фп? Сначала я думал, что однозначно фп, js же все же, но проходя курсы и дойдя до state, вижу все больше и больше именно классов. Так в чем же дело??

после релиза фифи react hooks (в феврале 2019) ооп потеряло актуальность

Георгий

старые значит туториалы и курсы :)

Конец 2018

Георгий

после релиза фифи react hooks (в феврале 2019) ооп потеряло актуальность

Край ухом слышал, что то про хуки, значит теперь именно фп

Danila

Новичек в реакте, немного запутался, что же тут в приоритете ооп или фп? Сначала я думал, что однозначно фп, js же все же, но проходя курсы и дойдя до state, вижу все больше и больше именно классов. Так в чем же дело??

Сейчас принято использовать хуки в новом коде. Курсы, выпущеные до выхода хуков (год назад и раньше) просто не имели возможности писать по-другому и ипользовали классы.

Roman

Ребят, кто-нибудь писал тесты для реакт компонентов? react-testing-library

Maxim

Как узнать состояние FinalForm вне самой формы?

🐏 Alexander

Как узнать состояние FinalForm вне самой формы?

так же, как и узнавать о state какого нибудь компонента

Maxim

так же, как и узнавать о state какого нибудь компонента

???

🐏 Alexander

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

Георгий

Сейчас принято использовать хуки в новом коде. Курсы, выпущеные до выхода хуков (год назад и раньше) просто не имели возможности писать по-другому и ипользовали классы.

Понял, тогда по ходу прохождения кода буду стараться вместо классов функции писать

Danila

Понял, тогда по ходу прохождения кода буду стараться вместо классов функции писать

Лично мне кажется, что ничего страшного от того, что ты будешь следовать курсу как там пишут нет - хотя бы не будешь путаться. А зная классы и ориентируясь в написании компонентов на них потом понять и перейти на хуки - дело пару часов на чтение документации и экспериментов. Пока никто убирать классовые компоненты из реакта не собирается

Maxim

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

каким образом пушить?

Andrew

Народ всем привет, а такой вопрос, я малёха не пойму, нашел такую штуку что в некоторых инпутах у меня стоит автозаполнение карточки(VISA,MasterCard), хотя там его не должно быть, в чём может быть соль?

Igor

реакт+бутстрап есть у кого нибудь?

Igor

реакт+бутстрап есть у кого нибудь?

адекватная тема? есть даже сайт офф

Олег

Алоха, как при клике по ячейке таблицы получить доступ к соседней ячейке? Чтобы вытащить значение или там ещё что-нибудь

wolfe

адекватная тема? есть даже сайт офф

если хотите — используйте. но есть другие UI-киты. где-то даже решены проблемы с неиспользуемыми стилями

🐏 Alexander

каким образом пушить?

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

Igor

если хотите — используйте. но есть другие UI-киты. где-то даже решены проблемы с неиспользуемыми стилями

можете варианты накидать?

wolfe

можете варианты накидать?

google: react ui kits/frameworks

Igor

окей спс

Ilya

Народ всем привет, а такой вопрос, я малёха не пойму, нашел такую штуку что в некоторых инпутах у меня стоит автозаполнение карточки(VISA,MasterCard), хотя там его не должно быть, в чём может быть соль?

Автозаполнение - ты имеешь в виду что браузер подставляет для пользователя?

Andrew

Автозаполнение - ты имеешь в виду что браузер подставляет для пользователя?

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

Andrew

та даже когда я на локалке открываю, и там есть этот инпут , то оно кидает ошибку по типу. Хотя под смыслом Номер карты, я имел ввиду пациента, которая находиться просто в базе у меня))

Kostya

демку собери

Вот демка! без стилей бутстрапа все показывает, а как толькоподключаю стили все убегает! https://codesandbox.io/s/exciting-bush-uwrdn

Джон

после релиза фифи react hooks (в феврале 2019) ооп потеряло актуальность

скажи это проектам, в которые будешь входить при поступлении на новую работу

Ilya

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

автокомплит и подстановка вообще в пределах формы нужны ? если нет т на уровне формы устанавливайте аттрибут <form autocomplete="off">

Ilya

на уровне инпута с аттрибутом тже стоит установить «none» принудительно <form autocomplete="off"> <input type="text" id="lastName" autocomplete="none"/> <input type="text" id="firstName" autocomplete="none"/> </form>

Ilya

или и на уровне инпута попробовать «off» вообщем тут колдунства именно вокруг правильной установки аттрибутов чтобы «шибко умный» браузер не воспринимал поле как поле для ввода номера банковской карты. В вашем случае при отсутствии явно установленного поведния - браузер принимая во внимание лейбл «номер карты» устанавливает эту логику самостоятельно

Ivan

Вот демка! без стилей бутстрапа все показывает, а как толькоподключаю стили все убегает! https://codesandbox.io/s/exciting-bush-uwrdn

https://codesandbox.io/s/upbeat-dawn-jbjcu <Carousel.Item> нужно рендерить непосредственно в методе .map

G.

Понял, тогда по ходу прохождения кода буду стараться вместо классов функции писать

Как на классах делается тоже не помешает знать. И ООП там по минимуму, в основном там классы для доступа к стейту и лайфсайкл методам

Andrew

или и на уровне инпута попробовать «off» вообщем тут колдунства именно вокруг правильной установки аттрибутов чтобы «шибко умный» браузер не воспринимал поле как поле для ввода номера банковской карты. В вашем случае при отсутствии явно установленного поведния - браузер принимая во внимание лейбл «номер карты» устанавливает эту логику самостоятельно

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

Alexander

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

Kostya

https://codesandbox.io/s/upbeat-dawn-jbjcu <Carousel.Item> нужно рендерить непосредственно в методе .map

Большое спасибо! Вопрос а почему?????? Реакт что за этим не следит получается? Я думал что задача реакта выстравиать дерево виртульаного дома и следить за промежуточными вычислениями!

Ivan

Большое спасибо! Вопрос а почему?????? Реакт что за этим не следит получается? Я думал что задача реакта выстравиать дерево виртульаного дома и следить за промежуточными вычислениями!

это заморочки бутстрапа, не реакта

Daniil

Большое спасибо! Вопрос а почему?????? Реакт что за этим не следит получается? Я думал что задача реакта выстравиать дерево виртульаного дома и следить за промежуточными вычислениями!

Посмотри реализацию класса Carousel

Artem

Как лучше всего приводить типы в typescript? Например string to number Обычно использовал что-то вроде parseInt/parseFloat, либо же Number() Как лучше?

Lena

кто-нибудь сталкивался возникает ошибка - send.php:1 Refused to load the image 'http://localhost:3000/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.

Ilya

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

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

Ilya

Как лучше всего приводить типы в typescript? Например string to number Обычно использовал что-то вроде parseInt/parseFloat, либо же Number() Как лучше?

принципиальной разницы - нет, но только учитывайте что методы parse Что-то, и перегрузки конструктора классов без ключевого слова new возврают вам значение в виде примитива - а конструкторы базовых классов c new - вам возвращают инстанс этого класса 🙂

SENATOR ARMSTRONG

Всем привет. Использую OverlayTrigger и Popover из react-bootstrap, такой вопрос: как сделать так, чтобы поповер не прятался, когда я навожу на него? Просто когда я убираю мышь с элемента в оверлей триггере на поповер он прячется, а мне нужно чтобы он сохранялся пока мышь наведена на поповер

Artem

принципиальной разницы - нет, но только учитывайте что методы parse Что-то, и перегрузки конструктора классов без ключевого слова new возврают вам значение в виде примитива - а конструкторы базовых классов c new - вам возвращают инстанс этого класса 🙂

Разница лишь в том, что с примитивом я не смогу делать ничего (фактически имею только значение), а с инстансом могу вызывать его методы?

Ilya

принципиальной разницы - нет, но только учитывайте что методы parse Что-то, и перегрузки конструктора классов без ключевого слова new возврают вам значение в виде примитива - а конструкторы базовых классов c new - вам возвращают инстанс этого класса 🙂

Aleksandr

кто-нибудь сталкивался возникает ошибка - send.php:1 Refused to load the image 'http://localhost:3000/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.

посмотри что такое xss

I'm

Привет! Начал изучать реакт. Передаю массив в компонент <Table data={books} />. А в компоненте Table принимаю props и хочу вывести первый элемент так {data[0]}. Но на странице не выводится. Код выложить пока не могу технически.

Danila

кто-нибудь сталкивался возникает ошибка - send.php:1 Refused to load the image 'http://localhost:3000/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.

Если в ангуляре, то обнови ангуляр-кли

Ilya

Разница лишь в том, что с примитивом я не смогу делать ничего (фактически имею только значение), а с инстансом могу вызывать его методы?

ну на примитивы транслируются методы прототипа базового класса - те же самые методы. но с точки зрения типов - примитив и инстанс класса базового типа - это не одно и то же 🙂 что для TS важно.

Artem

Станно, но VSCode дает пользоваться методами и без объявление экземпляра http://dl3.joxi.net/drive/2019/10/10/0026/0774/1741574/74/656f3f8f4a.jpg

I'm

Привет! Начал изучать реакт. Передаю массив в компонент <Table data={books} />. А в компоненте Table принимаю props и хочу вывести первый элемент так {data[0]}. Но на странице не выводится. Код выложить пока не могу технически.

Где туплю?

Artem

ну на примитивы транслируются методы прототипа базового класса - те же самые методы. но с точки зрения типов - примитив и инстанс класса базового типа - это не одно и то же 🙂 что для TS важно.

Раз методы транслируются, то зачем мне использовать new Number?

Nurdan

Где туплю?

сделай для начала console.log(this.props)