Кто может помочь? Такой вопрос, есть экшн креатор, редьюсер ловит 2 переменной из экшена и соответсвенно создает новый массив с новым полем, как поймать этот массив на обычном компоненте?

Покажите createStore с этим reducer-ом.

createStore => export const AUTH_USER = 'AUTH_USER'; export function authuser(login, password) { const RightLogin = 'login'; const RightPassword = 'password'; let error = ''; if ((login !== RightLogin) && (password !== RightPassword)) { error = 'Логин или пароль введены неверно'; return { type: AUTH_USER, login, password, error }; } else { return { type: AUTH_USER, login, password, error }; } } reducer => import { AUTH_USER } from './actions'; const initialState = { authuser: [ { login: '', password: '', name: '' } ], error: '' }; function homeReducer(state = initialState, action) { switch (action.type) { case AUTH_USER: let authUser = state.authuser; if (!action.error) { let login = action.login; authUser.push({name: login}); } return Object.assign({}, state, { error: action.error, name: name }); default: return state; } } const HomeReducer = { home: homeReducer }; export default HomeReducer;

Нужно вытащить поле name

createStore

Покажите

import { createStore, applyMiddleware, compose } from 'redux'; import rootReducer from './reducers'; import { DevTools } from './utils/index'; function _applyMiddleware() { const middleware = [ ]; return applyMiddleware(...middleware); } export default function configureStore(initialState) { const store = compose( _applyMiddleware(), DevTools.instrument() )(createStore)(rootReducer, initialState); return store; }

Ок, теперь ./reducers

import { combineReducers } from 'redux'; import { routerReducer } from 'react-router-redux'; import { HomeReducer } from './pages/home/index'; export default combineReducers({ routing: routerReducer, ...HomeReducer });

Ок. Минуту.

export default connect( state => ({ authUser: state.home.authUser }) )(YourComponent)

В this.props.authUser то что вам нужно

Благодарю, сейчас попробую)

Благодарю, сейчас попробую)

И у вас происходит мутация state при обработке AUTH_USER.

Это недопустимо.

Зачем вам authUser в виде Array. Вы предполагаете, что у вас будет несколько авторизованных пользователей?

Нет

1

Тогда нужно переделывать reducer

Давайте чтобы нам было проще поработаем в webpackbin

https://www.webpackbin.com/bins/-Kf8UG5GPgK5B00LELun

Включаю live режим

Примерно так

Как по вкладкам переключаться?

Так же рекомендую actionCreator делать FSA совместимым.

Чтобы кроме type и payload внутри ничего не было.

Отлично, вижу

По вкладкам, я должен выключить Live.

Так же думаю initialState еще сократить.

Да, думаю так лучше.

Зачем вам login, если вы его переименовываете в name?

Может все же login оставить?

Незачем)

Ок, исправил.

Все сильно упростилось, как видите.

Я новенький в реакте, не со всем ещё разобрался как что работает

Чтобы сделать FSA complaint, смотрите что нужно сделать.

И это не react. Это ES6 + redux

мелочевый вопрос, но все же, зачем было action.type выносить в отдельную переменную

не проще ли switch (action.type) ?

Люблю декомпозицию

export const authuser = (login, password) => { return { type: AUTH_USER, login, password, error: (login !== TEST_LOGIN && password !== TEST_PASSWORD) && ERROR_AUTH || null } }

Все, пользуйтесь.

Спасибо ?

Вам нужно немного переделать композицию reducer-ов, но думаю справитесь

а что означает payload в createStore.js ?

Стандарт какойй-то)

В createStore нет payload

type и payload в JSON ответе

export default (payload) => { хм

Можете почитать здесь: https://github.com/acdlite/flux-standard-action

what?

понял, спасибо, почитаю. Просто сразу стал использовать redux, миновав flux

Я тоже, но этот стандартом перетекло в redux.

redux-fsa, redux-thunk-fsa... *прикинулся шлангом* доп. фабрики и валидаторы, я лучше просто "буду в курсе" %)

))

Народ, привет! Можно ли так state модифицировать? Не нарушает ли это правил редукса? case ACTION_DEL_EXERCISE: state.sets .map(item => { item.exercises = item.exercises.filter(exercise => exercise.id != action.payload) }) return {...state, sets: state.sets}

и у тебя это работает?)

ERROR: S client not available

Ага)

state.sets не должен был измениться

Один момент, проверю...

Интересное явление, проверил state, он не меняется, но при этом на странице элемент пропадает.

https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Array/map

state.sets = state.sets.map...

Осталось понять почему элемент пропадает со страницы)

В общем. Этот вариант работает (во всяком случае под google chrome) state изменяется. Смотрю в консоль и вижу, что у меня по итогу prev state == next state Делаю вывод, что нельзя делать так. state.sets .map(item => { item.exercises = item.exercises.filter(exercise => { console.log([exercise.id, action.payload]) return exercise.id != action.payload }) })

Спасибо.

Если еще кто сможет объяснить почему это работает, будет здорово: state = { sets: [{ ex: [ {id: 1}, {id: 2} ] }] }; state.sets.map(a => { a.ex = a.ex.filter(ex => ex.id != 1) }); state.sets[0]

Мне не нужно, чтобы левые люди могли брать у меня данные

ахаха

Всем привет!

Как в пост запросе отправить объект загруженной картинки

я не знаю

Как в пост запросе отправить объект загруженной картинки

Поищи formdata

Поищи formdata

СПС, с помощью formdata сделал

Что лучше юзать для форм? react-bootstrap подключать?

react-form?

react-form?

о как, ладно, гляну. Спасибо

парни, как очистить store в redux?

сделать специальный экшн RESET_STATE

и возвращать в главном редюсере инишиал стейт

на него

От души братишка!

Кто-то знает, как элегантно вставить mock данные при использовании redux-axios-middleware?