combot.org/chat/-1001032883247

В стейте группировать пропсы можно? this.state = { group: [ { drums: DRUMS[Math.floor(Math.random() * DRUMS.length)] }, { hats: HATS[Math.floor(Math.random() * HATS.length)] }, ],

В стейте группировать пропсы можно? this.state = { group: [ { drums: DRUMS[Math.floor(Math.random() * DRUMS.length)] }, { hats: HATS[Math.floor(Math.random() * HATS.length)] }, ],

Почему нет? Обычный js объект же

Почему нет? Обычный js объект же

почему тоггда после вызова: this.state.group.play(() => this.playSound()); возвращается:

Потому что не определено this.state.group.play

Потому что не определено this.state.group.play

через forEach определять?

через forEach определять?

Функции play в стейте нет

Функции play нету у массива

Функции play нету у массива

Даже если была бы, не сработало

Даже если была бы, не сработало

почему тогда вызов: this.state.drums.play(() => this.playSound()); работает как надо?

почему тогда вызов: this.state.drums.play(() => this.playSound()); работает как надо?

Потому что у drums есть метод play

Видимо у drums есть такая функция

Потому что у drums есть метод play

в таком случае как вызвать play у группы group в которой у каждого пропса есть play?)))

в таком случае как вызвать play у группы group в которой у каждого пропса есть play?)))

Цикл пусти

У тебя же массив

Цикл пусти

map?

map возвращает новый массив, простой for of

for (let i of array) {}

map?

forEach

forEach

что не так? this.state.group.forEach.play((p => p.this.playSound()));

что не так? this.state.group.forEach.play((p => p.this.playSound()));

https://learn.javascript.ru/array-iteration#foreach

ребята, при переходе на /customers данные в сторе дублируются. В чем проблема? const mapStateToProps = (state) => { return { customersList: state.customers } }; export default connect(mapStateToProps)(Dashboard);

Reducer: export default function customers (state = [], action) { switch (action.type) { case types.FETCH_CUSTOMER_DATA: { return [ ...state, ...action.payload ]; } default: return state; } }

return [...state, action.payload] попробуй, может прокатит)

Reducer: export default function customers (state = [], action) { switch (action.type) { case types.FETCH_CUSTOMER_DATA: { return [ ...state, ...action.payload ]; } default: return state; } }

FETCH_CUSTOMER_DATA один раз вызывается? Что находится в action.payload? Что значит "данные дублируются"?

FETCH_CUSTOMER_DATA один раз вызывается? Что находится в action.payload? Что значит "данные дублируются"?

в componentWillMount вызывается this.props.dispatch(fetchData()); Как пишет логер, FETCH_CUSTOMERS_DATA вызывается 1 раз при переходе на линк /customers. Данные как-би добавляются в стор,не удаляя старые,тоесть получается новые данные + старые данныеб при том, что они одинаковые

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

[ ...state, ...action.payload ]; у тебя данные всегда будут "добавляться"

если нужно чтобы новые только были, то убери

...state

оставь просто [ ...action.payload ];

оставь просто [ ...action.payload ];

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

Всем привет. Ни как не могу освоить Async Action в redux, может кто подсказать, что ни будь кроме доки? можно на английском.

https://learn.javascript.ru/array-iteration#foreach

разница в синтаксисе путает( Чтобы разобраться, как мне для начала получить obj в консоль? this.state = { group: [ { drums: DRUMS[Math.floor(Math.random() * DRUMS.length)] }, { hats: HATS[Math.floor(Math.random() * HATS.length)] }, ], this.state.group.forEach(obj); console.log(obj);

Может кто-то объяснить почему локальные стили компонентов не видят глобальных sass переменных? Sass-переменные лежат в /src/styles/_colors.sass импортируются в основной файл /src/styles/main.sass с помощью @import colors. В корневом js файле импортируются import './styles/main.sass'. Но если создать для компонента свой стиль, то там не получается использовать переменные с _colors.sass, хотя если добавить какой-то класс в _colors.sass, то в jsx компонента его будет видно.

Может кто-то объяснить почему локальные стили компонентов не видят глобальных sass переменных? Sass-переменные лежат в /src/styles/_colors.sass импортируются в основной файл /src/styles/main.sass с помощью @import colors. В корневом js файле импортируются import './styles/main.sass'. Но если создать для компонента свой стиль, то там не получается использовать переменные с _colors.sass, хотя если добавить какой-то класс в _colors.sass, то в jsx компонента его будет видно.

импортируй _colors.sass в локальном файле для компонента.

импортируй _colors.sass в локальном файле для компонента.

хотелось место сэкономить, так в одном месте, а так во всех компонентах нужно вызывать, да и _colors.sass не один же такой файл будет. их может быть десятки. и хотя бы 5 из них импортировать в каждый js файл как-то не ок смотрится.

почему в js файл

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

и почему в js файл, а не в scss файл?

и почему в js файл, а не в scss файл?

перепутал. но я же так и делаю. все в main импортирую.

или каждый раз нужно main ещё и в каждый компонент импортировать?

просто все классы с main и colors видит, а вот переменные нет

обычно у тебя есть local_component.sass ты его импортируешь в js, в нужном компоненте. а внутри этого local_component.sass ты импортируешь @import '_color.sass'; @import '_variables.sass'; и т.д.

обычно у тебя есть local_component.sass ты его импортируешь в js, в нужном компоненте. а внутри этого local_component.sass ты импортируешь @import '_color.sass'; @import '_variables.sass'; и т.д.

окей, попробую

спасибо

хм, немного странный вопрос. пробую юзать fetch по этому туториалу. http://redux.js.org/docs/advanced/AsyncActions.html собственно, пока не коннектил к компонентам реакт, и пытаюсь дебажить из index.js куда импортирую actions и store. пытаюсь дебажить, так как явно что-то не то. в reducer, перед switch, ставлю console.log(action.type) дабы проверить, не перепутал ли я чего в actionConstant. единствнно что показывать мне консоль, это @@redux/INIT @@redux/PROBE_UNKNOWN_ACTION @@redux/INIT в самом index.js я выполняю 2 dispatch, никаких ошибок, но до reducers «не доходит» в консоли даже просто (action) не выполняется, от слова совсем, то есть не срабатывает даже console.log(‘1111’). код тут. https://github.com/BorodinDemid/advenced-redux

хм, немного странный вопрос. пробую юзать fetch по этому туториалу. http://redux.js.org/docs/advanced/AsyncActions.html собственно, пока не коннектил к компонентам реакт, и пытаюсь дебажить из index.js куда импортирую actions и store. пытаюсь дебажить, так как явно что-то не то. в reducer, перед switch, ставлю console.log(action.type) дабы проверить, не перепутал ли я чего в actionConstant. единствнно что показывать мне консоль, это @@redux/INIT @@redux/PROBE_UNKNOWN_ACTION @@redux/INIT в самом index.js я выполняю 2 dispatch, никаких ошибок, но до reducers «не доходит» в консоли даже просто (action) не выполняется, от слова совсем, то есть не срабатывает даже console.log(‘1111’). код тут. https://github.com/BorodinDemid/advenced-redux

нашел ответ собственно, криво заюзал redux-logger.

Почему два раза за раз создается объект?

https://gist.github.com/gHashTag/efbc812ec486efc79d1fac883764e537

Можно ещё в @reactnative_ru спросить)

Алексей: @socionika_alignment добро пожаловать

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

export const normalizeId = (value, previousValue) => { if (!value) { return value } const onlyNums = value.replace(/[^\d]/g, '') if (!previousValue || value.length > previousValue.length) { // typing forward if (onlyNums.length === 4) { return ${onlyNums}, } } if (onlyNums.length <= 4) { return onlyNums } }

Подскажите, пожалуйста. Есть ли преимущества в использовании react с typescript?

Ребят, привет! Вопрос: делаю setState и сразу же console.log(state) - то, что загнал в стейт undefined, почему?

Ребят, привет! Вопрос: делаю setState и сразу же console.log(state) - то, что загнал в стейт undefined, почему?

СетСтейт асинхронный, второй параметр в СетСТейт колбэк, после изменения стейта

СетСтейт асинхронный, второй параметр в СетСТейт колбэк, после изменения стейта

Не сработало

ERROR: S client not available

Не сработало

Ни разу такого не было, и вот опять. Покажи код

Ни разу такого не было, и вот опять. Покажи код

Оу простите, не туда стрелял - все работает с: спасибо!

всем привет

Подскажите пожалуйста почему я создаю store, <Provider store={createStore(postStore)}><App/></Provider> , а маплю уже state export default connect( state => ({posts:state}), dispatch => ({ deletePost:(post_id)=>{dispatch({type:'POST_DELETE', payload:post_id});} }), )(App) в чем сокральная разница? стейт только данные? а стор объект который смотрит за их изменением?

state хранится в store

store - место, state - сами данные

Здравствуйте, подскажите пожалуйста как можно более грамотно реализовать проверку на авторизацию в React? Все время обращаться к id или есть другие варианты? Я в этом плане новичок, гуглил и находил объемные сложные решения. Может вы как дураку скажите как это делается в общем??Спасибо

Подскажите, пожалуйста. Есть ли преимущества в использовании react с typescript?

Да

Нет

Лучше Flow

не не, лучше typescript :) преимущества есть, не будешь писать баги

Вкусовщина

У каждого есть свои плюсы и минусы

но лучше использовать flow/typescript чем без них)

У каждого есть свои плюсы и минусы

Опишите пожалуйста

слайдики https://djcordhose.github.io/flow-vs-typescript/2016_hhjs.html#/7

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

слайдики https://djcordhose.github.io/flow-vs-typescript/2016_hhjs.html#/7

Немного устаревший

первые ссылки в гугле прост

https://github.com/vkurchatkin/typescript-vs-flow

https://github.com/vkurchatkin/typescript-vs-flow

Только тут надо учесть, что надо смотреть начиная с №5

А №4 на данный момент показывает картину, противоположную декларируемой

Когда я пользуюсь react-router и статической генерацией, то результирующий javascript файл по объему на 30% больше получается. Почему это происохдит?

@vkurchatkin может на ближайшем React Moscow Meetup сделаешь lightning talk на тему, что лучше для React.js - TS vs Flow?

@vkurchatkin может на ближайшем React Moscow Meetup сделаешь lightning talk на тему, что лучше для React.js - TS vs Flow?

А будет интересна тема "ReactJS + php frameworks or CMS"?

Это как? :)

Php на бэкенде?

А причём тут реакт, если реакту как бы пофиг откуда брать данные?

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