Кек Когда нет аргументов — «всё уже написано»

напишу один аргумент

чтобы ты хуйню не писал

dispatch("SOME_ACTION") и сиди отыскивай по всему проекту поиском, где может разлочиться сага и пойти выполняться какая-то логика

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

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

dispatch("SOME_ACTION") и сиди отыскивай по всему проекту поиском, где может разлочиться сага и пойти выполняться какая-то логика

Согласен, да. Но слабоватый аргумент, как мне кажется. Очень он напоминает аргумент «js говно — .valueOf переопределяешь в одном месте и ищи потом, число это или объект». Уверен на 98%, что на эффекторе можно кучу говна наворотить без навыков структуризации и проектирования.

Согласен, да. Но слабоватый аргумент, как мне кажется. Очень он напоминает аргумент «js говно — .valueOf переопределяешь в одном месте и ищи потом, число это или объект». Уверен на 98%, что на эффекторе можно кучу говна наворотить без навыков структуризации и проектирования.

сага не дает никакой возможности избежать такого

Есть чат по parcel?

когда не понимаешь — перемудрено!

Дело же не в понимаешь/не понимаешь, у Эффектора довольно большой и не очень хорошо документированный апи, и это вполне может быть причиной против выбора в его пользу

Дело же не в понимаешь/не понимаешь, у Эффектора довольно большой и не очень хорошо документированный апи, и это вполне может быть причиной против выбора в его пользу

Да. Тут согласен

Всем привет дкикий вопрос! А null вставлять в рендер это нормально? умя есть идея делать фильтр на уровне детей передавать пропс им виден ли он или нет. Или же , в родителе перед рендером делать фильтр массивва?

Всем привет дкикий вопрос! А null вставлять в рендер это нормально? умя есть идея делать фильтр на уровне детей передавать пропс им виден ли он или нет. Или же , в родителе перед рендером делать фильтр массивва?

Норм

dispatch("SOME_ACTION") и сиди отыскивай по всему проекту поиском, где может разлочиться сага и пойти выполняться какая-то логика

Да но а если есть экшены и мимо них диспатч не юзается

нужно ли при тесте хука его анмаунтить ?

иногда ошибки стреляют тест прошел а хук иожет вызвать эффект и не дожижается

как прикрутить функций на кнопку escape в элементе textField из материала? пробовал передать функцию onKeyPress, в ней как e.key приходят клавиши, буквы, ентер, но escape не проходит. const onKeyPress = (e) => { console.log(e.key) }

На onKeyDown работает

так нет же. метод onKeyDown тупо не отрабатывает на кнопку escape

https://codesandbox.io/s/material-demo-i5lxw

Всем привет дкикий вопрос! А null вставлять в рендер это нормально? умя есть идея делать фильтр на уровне детей передавать пропс им виден ли он или нет. Или же , в родителе перед рендером делать фильтр массивва?

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

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

просто есть вариант) в родителе сделать фильтр))

Оба варианта приемлемы, но фильтр в родителе будет лучше

Дело же не в понимаешь/не понимаешь, у Эффектора довольно большой и не очень хорошо документированный апи, и это вполне может быть причиной против выбора в его пользу

а что там плохо документировано то? (акромя мб доменов)

как правильно юзать textarea и contentEditable? у меня не получается нормально вставить html

как правильно юзать textarea и contentEditable? у меня не получается нормально вставить html

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

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

сделал вместо textarea div и все заработало

а что вы используете чтобы успростить работу с редаксом? я про создание экшн, редьюсеров и тд я знаю redux-symbiote, redux-act. что из них лучше или что есть другое, но получше?

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

а что вы используете чтобы успростить работу с редаксом? я про создание экшн, редьюсеров и тд я знаю redux-symbiote, redux-act. что из них лучше или что есть другое, но получше?

отказались от него *trollface*

kek

Подскажите, как на эффекторе выполнить задачку: есть внешний event emitter, по событиям которого нужно сходить в апи, потом в localeStorage, потом в ui?

отказались от него *trollface*

в пользу чего?

в пользу чего?

effector

Подскажите, как на эффекторе выполнить задачку: есть внешний event emitter, по событиям которого нужно сходить в апи, потом в localeStorage, потом в ui?

лучше в @effector_ru

На onKeyDown работает

Та я уже сделал. Спасибо.

Ребята, как коллбеки на саги передаются в помпоненты их же надо наверное как-то коннектить к React типо MapDispachToProps/

Ребята, как коллбеки на саги передаются в помпоненты их же надо наверное как-то коннектить к React типо MapDispachToProps/

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

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

А в пропсы как она передается, создается Action Creator на вочер и далее он как пропс передается, так я понял?

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

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

А как передать какой-то параметр с экшеном. Допустим у меня fetchNewImage - это Action Creator, там ее номер изображения. Как его прокинуть именно в сам вотчет саги, а далее в асинхоронный запрос, не нашел примера в сети.

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

export const fetchNewImage = () => ({type: FETCH_NEW_IMAGE}); export function* watchFetchImage() { yield takeEvery('FETCH_NEW_IMAGE', fetchImageAsync); } function* fetchImageAsync() { try { yield put(requestNewImage()); const data = yield call(() => { return fetch('https://api.giphy.com/v1/gifs/random?api_key=gR30u9O8KPOanwIQupHbD90d4k57EOeY') .then(res => res.json().data.images) } ); Вот тут еще номер нужно изображения передать

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

componentDidMount() { this.props.fetchNewImage(0); } Вот так в UI нужно, при загрузке только первое изображение из БД грузить

export const fetchNewImage = () => ({type: FETCH_NEW_IMAGE}); export function* watchFetchImage() { yield takeEvery('FETCH_NEW_IMAGE', fetchImageAsync); } function* fetchImageAsync() { try { yield put(requestNewImage()); const data = yield call(() => { return fetch('https://api.giphy.com/v1/gifs/random?api_key=gR30u9O8KPOanwIQupHbD90d4k57EOeY') .then(res => res.json().data.images) } ); Вот тут еще номер нужно изображения передать

В fetchImageAsync первым параметром приходит объект экшена, от туда можешь брать пейлоад

В fetchImageAsync первым параметром приходит объект экшена, от туда можешь брать пейлоад

export const fetchNewImage = (index) => ({type: FETCH_NEW_IMAGE, index}); export function* watchFetchImage() { yield takeEvery('FETCH_NEW_IMAGE', fetchImageAsync); } function* fetchImageAsync(index) { try { yield put(requestNewImage()); const data = yield call(() => { return fetch('https://api.giphy.com/v1/gifs/random?api_key=gR30u9O8KPOanwIQupHbD90d4k57EOeY') .then(res => res.json().data.images.index) } );

В fetchImageAsync первым параметром приходит объект экшена, от туда можешь брать пейлоад

Так?

Сделай дестуктуризацию { index }, ну а так да

Сделай дестуктуризацию { index }, ну а так да

Точно так, просто как-то это не очевидно, в вотчер же индекс не передается

Сделай дестуктуризацию { index }, ну а так да

То есть вотчер вотчит Экшен тайп + передает дальше нагрузку, верно я понял?

То есть вотчер вотчит Экшен тайп + передает дальше нагрузку, верно я понял?

Да

Да

Ок. Чекну. Спасибо. На всякий тебе чиркану в личку елси что чтобы забиндить тебя)

То есть вотчер вотчит Экшен тайп + передает дальше нагрузку, верно я понял?

Так же ты можешь передать свои параметры в fetchImageAsync, в takeEvery, дополнительными аргументами, только теперь в fetchImageAsync экшин будет последним аргументом

2016

Есть и 19 года книжки

Посоны, обьясните почему в 18 строке name в [ ], я прочитал по документации, но не понял для чего это, обьясните простым языком пожалуйста https://codepen.io/gaearon/pen/wgedvV?editors=0010

По реакту кстати я не нашёл ни одной книги, где бы показывали хорошие практики. Лишь объяснение синтаксиса, которое можно и на офф сайте найти

Посоны, обьясните почему в 18 строке name в [ ], я прочитал по документации, но не понял для чего это, обьясните простым языком пожалуйста https://codepen.io/gaearon/pen/wgedvV?editors=0010

Смотри. let name = "blabla"; let obj1 = {name: 123} // на выходе {name: 123} let obj2 = {[name]: 123} // на выходе {blabla: 123}

Смотри. let name = "blabla"; let obj1 = {name: 123} // на выходе {name: 123} let obj2 = {[name]: 123} // на выходе {blabla: 123}

Теперь понял, спасибо

Смотри. let name = "blabla"; let obj1 = {name: 123} // на выходе {name: 123} let obj2 = {[name]: 123} // на выходе {blabla: 123}

Вычисляемые свойства вроде да,?

Вычисляемые свойства вроде да,?

Да, они так называются

Вычисляемые свойства вроде да,?

Ага.

Вычисляемые свойства вроде да,?

Только если прям точно, то "вычесляемые имена свойств"

Только если прям точно, то "вычесляемые имена свойств"

Пока так и не нашёл им применения в своих проектах )

Пока так и не нашёл им применения в своих проектах )

Я юзаю

Я юзаю

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

Удобство

Вместо нескольких строк - одна

return { ...state, [key]: value }

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

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

return { ...state, [key]: value }

О

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

ну, предыдущий синтаксис же никуда не делся object[key] = 1 это просто shorthand

ну, предыдущий синтаксис же никуда не делся object[key] = 1 это просто shorthand

Я подумал, что вопрос вообще о вычисляемых именах. А так, да, то же самое

export const fetchNewImage = (index) => ({type: FETCH_NEW_IMAGE, index}); export function* watchFetchImage() { yield takeEvery('FETCH_NEW_IMAGE', fetchImageAsync); } function* fetchImageAsync(index) { try { yield put(requestNewImage()); const data = yield call(() => { return fetch('https://api.giphy.com/v1/gifs/random?api_key=gR30u9O8KPOanwIQupHbD90d4k57EOeY') .then(res => res.json().data.images.index) } );

Половина смысла саг в том, что они позволяют удобно тестировать код. Такой код убивает эту фичу. Вот так будет лучше // utils const jsonFetch = (...args) => fetch(...args).then(r => r.json()); // логика put(requestNewImage()); const data = yield call(jsonFetch, 'url...'); data.images.index

ну, предыдущий синтаксис же никуда не делся object[key] = 1 это просто shorthand

Не совсем shorthand, там есть трюки с defineProperty https://github.com/facebook/relay/blob/master/packages/relay-runtime/store/RelayModernRecord.js#L29

привет, кто-нибудь юзал react +redux +socket. io? помогите разобраться

Половина смысла саг в том, что они позволяют удобно тестировать код. Такой код убивает эту фичу. Вот так будет лучше // utils const jsonFetch = (...args) => fetch(...args).then(r => r.json()); // логика put(requestNewImage()); const data = yield call(jsonFetch, 'url...'); data.images.index

Не понятно, у меня почему-то индекс не передается с UI export const fetchNewImage = (index) => ({type: FETCH_NEW_IMAGE, index}); export function* watchFetchImage() { yield takeEvery('FETCH_NEW_IMAGE', fetchImageAsync); } function* fetchImageAsync(index) { try { yield put(requestNewImage()); const data = yield call(() => { return fetch('https://api.giphy.com/v1/gifs/random?api_key=gR30u9O8KPOanwIQupHbD90d4k57EOeY') .then(res => res.json()) } ); console.log(Object.values(data.data.images)[index].url); yield put(requestNewImageSucceeded(Object.values(data.data.images)[index].url)); } catch (error) { yield put(requestNewImageFailed()); } } ComponentDidMount() { this.props.fetchNewImage(0); }

не вижу вызова redux dispatch(fetchNewImage(0))

который словит takeEvery, он есть?

watchFetchImage запущена в rootSaga?

не вижу вызова redux dispatch(fetchNewImage(0))

componentDidMount() { this.props.fetchNewImage(0); } Так этот метод же через пропсы передается, я так понял

не вижу вызова redux dispatch(fetchNewImage(0))

export default compose( connect(mapStateToProps, {fetchNewImage, increaseCurrentImageIndex}), withRouter )(Main);

FETCH_NEW_IMAGE виден в redux devtools?

FETCH_NEW_IMAGE виден в redux devtools?

Сага заработала, этим тулзом так и не пользуюсь до сих пор