На главном экране я получаю песни из API и сохраняю их в состоянии компонента. Теперь после рендеринга песен и при нажатии на любую из них я отправляю действие для сохранения всех песен в избыточном состоянии и отправить другое действие, чтобы отобразить нижнего игрока "true / false" Но Я получил эту ошибку
Ошибка: Действия должны быть простыми объектами. Используйте пользовательское промежуточное ПО для асинхронных действий
Я не знаю, почему оно появляется, это просто массив, который я хочу сохранить!
Главный экран
_renderItem = ({item, index}) => {
const {url} = this.state;
return (
<TouchableNativeFeed
key={item.id}
onPress={() => {
console.log(
'index-recent_tunes',
index,
this.state.recent_tunes,
); // I can see the output "array of songs" + index
this.props.saveSongs(this.state.recent_tunes, index);
this.props.isPlaying(true);
}}
.....
}
const mapDispatchToProps = dispatch => {
return {
isPlaying: _isPlaying => {
dispatch(isPlayingAction(_isPlaying));
},
saveSongs: (songs, index) => {
dispatch(songsInPlayerAction(songs, index));
},
};
};
export default connect(null, mapDispatchToProps)(Home);
Redux
Редуктор
import {SONGS_IN_PLAYER} from '../actions/types';
let initialState = {
allSongs: [],
currentIndex: 0,
};
const songsInPlayerReducer = (state = initialState, action) => {
switch (action.type) {
case SONGS_IN_PLAYER:
return {
...state,
allSongs: action.songs,
currentIndex: action.index,
};
default:
return state;
}
};
export default songsInPlayerReducer;
Действие
import {SONGS_IN_PLAYER} from './types';
export const saveSongsPlayer = (songs, currentIndex) => {
return {
type: SONGS_IN_PLAYER,
songs,
currentIndex,
};
};
Магазин
const persistConfig = {
key: 'root',
storage: AsyncStorage,
};
const rootReducer = combineReducers({
....
songsInPlayer: songsInPlayerReducer,
....
});
const persistedReducer = persistReducer(persistConfig, rootReducer);
export const store = createStore(
persistedReducer,
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__(),
);
export const persistor = persistStore(store);