https://github.com/azat-io/you-dont-know-js-ru

Сейчас читаю часть про асинк и перфоманс

Книга топ

Я себе с амазона хочу все тома заказать

Я себе с амазона хочу все тома заказать

Зачем? Бумаг идома мало?

А мне не удобно на ноуте читать

Тем более я оч люблю прям в книге пометки делать

А мне не удобно на ноуте читать

Распечатать тоже не вариант?

Я сам люблю бумажные книги, но только художественные.

Тем более я оч люблю прям в книге пометки делать

Хотя печатная удобно тоже, заметки можно удобно делать и на ноуте условном)

Тем более я оч люблю прям в книге пометки делать

Электронные читалки - твой вариант)

Сесть летом в парке, почитать

Электронные читалки - твой вариант)

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

Электронные читалки - твой вариант)

С личного опыта, не нравятся мне они для чтения технической литературы) Для художественной - замечательно Хотя, ради чистоты эксперимента закину книгу в хорошем качестве, и посмотрю. А то в студенчестве пдф-ки читал

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

На экране лэптопа и делай пометки, желтым маркером))? Или можно купить surface от Майкрософт

Асинхронный рендеринг уже сейчас: https://codesandbox.io/s/m4kxx3qw7y

не совсем

ну да ладно

Ребят, кто использует Formik, может знаете как сделать вычисляемые поля для FieldArray? Тип у меня есть [{a: 10, b: 20}, {a: 25, b: 37}, ....] и мне нужны поля sumOfA, sumOfB в которых будет сумма этих столбцов. при изменении полей, сумма офк должа автоматом пересчитываться.

Есть крч react-cookie, на сервере и на клиенте оборачиваю в CookiesProvider, только вот на сервере он с пропсом cookies. Дело в том, если я в компоненте буду логать cookies, который мне приходит с хока WithRouter, он будет пустой, а сервер логает объект заполненый куками, как подобное исправить ?

Есть крч react-cookie, на сервере и на клиенте оборачиваю в CookiesProvider, только вот на сервере он с пропсом cookies. Дело в том, если я в компоненте буду логать cookies, который мне приходит с хока WithRouter, он будет пустой, а сервер логает объект заполненый куками, как подобное исправить ?

куки не httponly случайно?

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

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

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

так надо делать get

всем привет, кто знает, почему при onChange на Input от материал отстает на один символ?Как можно порешать такой трабл?

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

Код покажите

Сейчас

authorChange = (event) => { this.setState({author: event.target.value}); console.log(this.state.author, 'author'); }; render() { return ( <Input floatText="Автор книги" styles={inlineStyles.input} onChange={this.authorChange} />) }

Должно меняться, как надо

setState асинхронный

authorChange = (event) => { this.setState({author: event.target.value}, () => { console.log(this.state.author, 'author'); }); };

authorChange = (event) => { this.setState({author: event.target.value}, () => { console.log(this.state.author, 'author'); }); };

Вот так напишите

Сейчас попробую

Вот так напишите

Заработало, спасибо огромное, а где можно про такие тонкости почитать?Не подскажите случайно

) reactjs.org

) reactjs.org

Хах))Понял, спасибо еще раз!

Лиля пишет на реакте. Лиля никак не решит, где хранить данные — в локальном стейте или в сторе. Лиля делает setState(), но друзья смеются над ней. Лиля решает хранить все в сторе, но на code review получает противоречивые комментарии. Лиля несчастна. Ей поможет logic review. Это встреча, на которой фронтенд-разработчики разного уровня помогают друг другу избежать архитектурно неправильных решений. Здесь мы с Лилей рассмотрим разные кейсы, учтем все нюансы и найдем лучшее решение. Лиля зафиксирует выводы и пройдет code review — Лиля счастлива. Этот вопрос больше никого не поставит в тупик — и все в отделе счастливы. https://habr.com/company/yamoney/blog/354416/

^ у кого есть что либо похожее?

Всем привет, может кто подсказать, сделал табы, но что-то не пойму как можно реализовать смену цвета активного таба?

active={tabIndex === 1}

И тд

Всем привет, может кто подсказать, сделал табы, но что-то не пойму как можно реализовать смену цвета активного таба?

активыный таб, это то у которого tabindex ==1? тогда навешиваешь ему класс active и там через css меняешь цвет

не совсем, индекс меняется

т.е я на каждый итем вешаю свой индекс и в зависимости от индекса показываю контент

Народ, как сейчас пишут css в реакт-экосистеме? - css in js - styled components - css modules или еще как?

Народ, как сейчас пишут css в реакт-экосистеме? - css in js - styled components - css modules или еще как?

все варианты + sass

активыный таб, это то у которого tabindex ==1? тогда навешиваешь ему класс active и там через css меняешь цвет

В твоём случае у каждого айтема нужно прописать tabIndex===0, tabIndex===1 и так далее

Всем привет, может кто подсказать, сделал табы, но что-то не пойму как можно реализовать смену цвета активного таба?

Только выкинь local state и воспользуйся Value is react-powerplug

Бррр, скинь код куданить на codesandbox - поправлю.

Народ, как сейчас пишут css в реакт-экосистеме? - css in js - styled components - css modules или еще как?

т. е. явного лидера среди них нету?

В твоём случае у каждого айтема нужно прописать tabIndex===0, tabIndex===1 и так далее

в ТВОЕМ случае внимательнее смотри, кому отвечаешь

ERROR: S client not available

в ТВОЕМ случае внимательнее смотри, кому отвечаешь

Полегче, ты оскорбился, я вижу?

Полегче, ты оскорбился, я вижу?

еще как. Впереди ночь, полная слез и обиды. Ну откуда мне знать, видишь ты или нет? Скорее всего да, так как печатаешь что-то в чат.

еще как. Впереди ночь, полная слез и обиды. Ну откуда мне знать, видишь ты или нет? Скорее всего да, так как печатаешь что-то в чат.

Ну бывает..

т.е я на каждый итем вешаю свой индекс и в зависимости от индекса показываю контент

Вынеси метод onclick отдельно, и пропиши там, чтобы при клике назначался класс active текущему табу,

Привет, только постигаю реакт, пытаюсь от api получить данные , выдает Failed to load http://localhost:8000/posts/?format=json: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

let axiosConfig = { headers: { 'Content-Type': 'application/json;charset=UTF-8', "Access-Control-Allow-Origin": "*", } }; componentDidMount() { axios.get(`http://localhost:8000/posts/?format=json`, axiosConfig) .then(res => { const posts = res.data; this.setState({ posts }); }) }

let axiosConfig = { headers: { 'Content-Type': 'application/json;charset=UTF-8', "Access-Control-Allow-Origin": "*", } }; componentDidMount() { axios.get(`http://localhost:8000/posts/?format=json`, axiosConfig) .then(res => { const posts = res.data; this.setState({ posts }); }) }

Подними nginx

Ненадо очередной cors прикручивать

Подними nginx

на дев машине?

Ну да

Там 3 строчки конфига

А реактовское приложение по какому адресу живет?

а как нибудь без него не обойтись? через webpack например

А реактовское приложение по какому адресу живет?

8080

localhost

а как нибудь без него не обойтись? через webpack например

тогда прописывай прокси

devServer: { headers: { "Access-Control-Allow-Origin": "*", // "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept" }, contentBase: './public', hot: true } };

пытался в вебпаке

тогда прописывай прокси

прокси? а можно подроней.

В package.json пропииши "proxy": "http://localhost:SERVER/"server - порт сервера. Запрос тогда в axios посылаешь на свой клиент - axios.get(`http://localhost:CLIENT/

бэка на джанго drf

client - порт на котором работает реакт

то есть клиент

В package.json пропииши "proxy": "http://localhost:SERVER/"server - порт сервера. Запрос тогда в axios посылаешь на свой клиент - axios.get(`http://localhost:CLIENT/

спс попробуем

спс попробуем

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