окей.... продолжайте дальше в том же духе.

дело вкуса же, в чем проблема то?

проблема будет еще в дев тулсе браузера, там будет куча IfTrue

проблема будет еще в дев тулсе браузера, там будет куча IfTrue

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

Скажите, что нынче заюзать для анимации в реакте? react-motion?

Или react-addons-css-transition-group? Ничто не старьё, все актуально?

Или react-addons-css-transition-group? Ничто не старьё, все актуально?

https://animakit.github.io

:)

https://github.com/brillout/awesome-react-components#ui-animation

Кажется сам разобрался, удалил

метод утенка решает

Шаришь

подскажите что значит call PropTypes directly

что то из доков не понял

угу

начали продавать билеты на реакт европ 2017

а можно как-то сделать в css-modules чтобы в <div class="table__table___32osj"> <div class="table__row___2w27N"> <div class="table__cell___1oVw5">A0</div> <div class="table__cell___1oVw5">B0</div> </div> </div> корневой элемент получал только имя файла (либо только имя локального селектора)?

чтобы было просто table__32osj

чтобы было просто table__32osj

но зачем? это вообще служебные имена

чтобы красиво было, и только

+ проблемы с определением “корневого элемента”

ребят подскажите какую то либу к реакту

вместо редакса

для MVC

mobx?

+

как заставить компонент перехватывать keyDown во всем окне, независимо от фокуса в этом компоненте?

window.addEventListener

а это нормально лезть в window из компонента

?

как заставить компонент перехватывать keyDown во всем окне, независимо от фокуса в этом компоненте?

https://github.com/STRML/react-document-events

Да, при маунте добавляешь, при анмаунте удаляешь

А что вы используете для ajax запросов?

файлик из 60 строчек кода который копирую из проекта в проект function request(method, path, query, body, headers, upload, download){ return new Promise((resolve, reject)=>{ var xhr = new XMLHttpRequest(); var url = path + (query && Object.keys(query).length ? ('?'+qs.stringify(query)) : ''); xhr.open(method, url); xhr.setRequestHeader('Accept', 'application/json'); var bodyString; if (method !== "GET" && body) { if (body instanceof Blob) { bodyString = body; } else { bodyString = JSON.stringify(body); xhr.setRequestHeader('Content-Type', 'application/json'); } } if(headers) { for (var header in headers) { xhr.setRequestHeader(header, headers[header]) } } if(upload){ xhr.upload.onprogress = function(event) { var percent = Math.floor((event.loaded / event.total) * 100); upload(percent, event.loaded, event.total); }; } if(download){ xhr.onprogress = function(event) { var percent = Math.floor((event.loaded / event.total) * 100); download(percent, event.loaded, event.total); } } xhr.onload = xhr.onerror = function() { try { var receivedData = JSON.parse(this.responseText); } catch(e){ reject('wrong json response', this.responseText); } if (this.status >= 200 && this.status <= 299) { resolve(receivedData) } else { reject(receivedData) } }; xhr.send(bodyString); }) } request.get = request.bind(null, "GET"); request.post = request.bind(null, "POST"); request.put = request.bind(null, "PUT"); request.delete = request.bind(null, "DELETE");

файлик из 60 строчек кода который копирую из проекта в проект function request(method, path, query, body, headers, upload, download){ return new Promise((resolve, reject)=>{ var xhr = new XMLHttpRequest(); var url = path + (query && Object.keys(query).length ? ('?'+qs.stringify(query)) : ''); xhr.open(method, url); xhr.setRequestHeader('Accept', 'application/json'); var bodyString; if (method !== "GET" && body) { if (body instanceof Blob) { bodyString = body; } else { bodyString = JSON.stringify(body); xhr.setRequestHeader('Content-Type', 'application/json'); } } if(headers) { for (var header in headers) { xhr.setRequestHeader(header, headers[header]) } } if(upload){ xhr.upload.onprogress = function(event) { var percent = Math.floor((event.loaded / event.total) * 100); upload(percent, event.loaded, event.total); }; } if(download){ xhr.onprogress = function(event) { var percent = Math.floor((event.loaded / event.total) * 100); download(percent, event.loaded, event.total); } } xhr.onload = xhr.onerror = function() { try { var receivedData = JSON.parse(this.responseText); } catch(e){ reject('wrong json response', this.responseText); } if (this.status >= 200 && this.status <= 299) { resolve(receivedData) } else { reject(receivedData) } }; xhr.send(bodyString); }) } request.get = request.bind(null, "GET"); request.post = request.bind(null, "POST"); request.put = request.bind(null, "PUT"); request.delete = request.bind(null, "DELETE");

npm не вариант? :)

файлик из 60 строчек кода который копирую из проекта в проект function request(method, path, query, body, headers, upload, download){ return new Promise((resolve, reject)=>{ var xhr = new XMLHttpRequest(); var url = path + (query && Object.keys(query).length ? ('?'+qs.stringify(query)) : ''); xhr.open(method, url); xhr.setRequestHeader('Accept', 'application/json'); var bodyString; if (method !== "GET" && body) { if (body instanceof Blob) { bodyString = body; } else { bodyString = JSON.stringify(body); xhr.setRequestHeader('Content-Type', 'application/json'); } } if(headers) { for (var header in headers) { xhr.setRequestHeader(header, headers[header]) } } if(upload){ xhr.upload.onprogress = function(event) { var percent = Math.floor((event.loaded / event.total) * 100); upload(percent, event.loaded, event.total); }; } if(download){ xhr.onprogress = function(event) { var percent = Math.floor((event.loaded / event.total) * 100); download(percent, event.loaded, event.total); } } xhr.onload = xhr.onerror = function() { try { var receivedData = JSON.parse(this.responseText); } catch(e){ reject('wrong json response', this.responseText); } if (this.status >= 200 && this.status <= 299) { resolve(receivedData) } else { reject(receivedData) } }; xhr.send(bodyString); }) } request.get = request.bind(null, "GET"); request.post = request.bind(null, "POST"); request.put = request.bind(null, "PUT"); request.delete = request.bind(null, "DELETE");

уж лучше fetch

https://github.com/jqestate/http.js

А что вы используете для ajax запросов?

fetch

буэ

уж лучше fetch

+

Чем лучше

или axios

fetch довольно геморройный.

чем?

Параметры прописать всякие, чтобы куки слались, response.json(), ошибки ловить (503 по умолчанию в catch не падает по понятным причинам). Всё равно обвязку писать придётся, чтобы простое обращение за json'кой не занимало десятки строк.

ребят подскажите какую то либу к реакту

reflux

npm не вариант? :)

я просто не любитель раздувать зависимости. Можно конечно вынести этот код в свой пакет, но мне кажется посмотреть другому человеку 60 строчек кода в папке utils быстрее чем идти в package.json потом на сайт npm, потом на гитхаб и там смотреть исходники

я просто не любитель раздувать зависимости. Можно конечно вынести этот код в свой пакет, но мне кажется посмотреть другому человеку 60 строчек кода в папке utils быстрее чем идти в package.json потом на сайт npm, потом на гитхаб и там смотреть исходники

Плюсую. Выносить стоит что-то, что может меняться-обновляться.

я просто не любитель раздувать зависимости. Можно конечно вынести этот код в свой пакет, но мне кажется посмотреть другому человеку 60 строчек кода в папке utils быстрее чем идти в package.json потом на сайт npm, потом на гитхаб и там смотреть исходники

npm repo dep-name

я просто не любитель раздувать зависимости. Можно конечно вынести этот код в свой пакет, но мне кажется посмотреть другому человеку 60 строчек кода в папке utils быстрее чем идти в package.json потом на сайт npm, потом на гитхаб и там смотреть исходники

плюс с документацией fetch знакомы почти все, исходники тоже многие читали

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

Ну так всё равно велосипед писать придётся, не будешь же ты каждый раз прописывать параметры авторизации, хедеры нужные и т.д.

это уже app-специфик имплементация

это норм

он ужасен

это уже app-специфик имплементация

Ну там уже не сильно важно, что под капотом, хоть $.ajax

он ужасен

а более аргументированно?

Хотя fetch лучше, конечно.

а более аргументированно?

Экшены не синхронные

а более аргументированно?

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

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

а чем реализация разными вариантами плоха?

ERROR: S client not available

вообще несколько сторов - это отвратительно) нужен 1 стейт, иначе нереально дебажить

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

ну может для оптимизаций 2-3, но это прям если сильно припечет

вообще несколько сторов - это отвратительно) нужен 1 стейт, иначе нереально дебажить

не согласен

я по опыту работы с flux говорю. Который фейсбучный

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

про это есть ишью на гх в реакт репе

там тоже норм кейсы

или в редаксе наверное, не в реакте

а чем реализация разными вариантами плоха?

А чем вы тестируете приложение на Reflux?

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

а, тут я не спорю. Но это прямо таки определенные кейсы. Я про flux-подобные решения, где каждый редьюсер (в концепции редакса) - отдельный стор

А чем вы тестируете приложение на Reflux?

на моке, а так же у нас selenium

> Paul Klimashkin [5/22/16] mobx можно не использовать не потому что он новый, а потому что это старые грабли В старых добрых обзерверах и копьютедах. С ростом проекта будет расти кол-во кроссзависимых обзерверов, обновления будут выстреливать в разные стороны как феерверк, что усложняет отладку и приводит к неочевыдным багам или к циклическим зависимостям, которые сложно распутать или найти точку прекращения распространения обновлений А может кто-то объяснить в чем проблема роста кроссзависимых обзерверов? Эти больше по технической части mobx (типа будет тормозить в отличии от редакса) или может какая-то тема архитектуры (типа нет контейнеров и нужно передавать все через пропсы)

вообще несколько сторов - это отвратительно) нужен 1 стейт, иначе нереально дебажить

нуну... при огромной аппликухе я посмотрю - как вы это сделаете. что проще - искать что то маленькое в огромном или в какой то отдельной части

на моке, а так же у нас selenium

А в сторе все функции чистые? У меня имеется проблема, что в сторе куча зависимостей в функциях.

нуну... при огромной аппликухе я посмотрю - как вы это сделаете. что проще - искать что то маленькое в огромном или в какой то отдельной части

огромная - это как определить?

огромная - это как определить?

это когда апп имеет порядка 30 уникальных по логике секций (модулей) и каждый модуль может имеет еще разный функционал и требует сохранения данных

А в сторе все функции чистые? У меня имеется проблема, что в сторе куча зависимостей в функциях.

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

ну либо уносить на уровень каких то утилит

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

А state храните как свойство стора?

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

Попробуйте alt, там есть зависимые сторы

А state храните как свойство стора?

стейт чего? у нас огромное кол-во форм, умных и глупых компонентов

стейт чего? у нас огромное кол-во форм, умных и глупых компонентов

Стейт одного из "контейнеров". Доступ из методов стора к стейт как осуществляется, как this.state или как-то передаётся через параметры?

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

В итоге у тебя всё равно один стор на продукте?

у меня много проектов. везде по-разному. и везде разные flux-like либы

Стейт одного из "контейнеров". Доступ из методов стора к стейт как осуществляется, как this.state или как-то передаётся через параметры?

да, через параметры

да, через параметры

А как это организовано? В примерах, которые я сморел, доступ осуществляется через this.state

А как это организовано? В примерах, которые я сморел, доступ осуществляется через this.state

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

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

А в store.trigger же нужно целиком state передавать. Если мы не целиком в метод стейт передали, что тогда? Или нужно при каждом вызове весь стейт передавать обязательно?