Redux Persist保存多个数据

Question

我正在使用https://github.com/cinder92/react-native-get-music-files来通过我的应用在用户设备上获取音乐文件，我正在使用redux持久性，以便当音乐在用户手机上加载一次并且用户返回时到应用程序，它将只检查不在tracks状态数组中的新音乐，它不必重新扫描所有音乐，它只会在背景中检查新音乐，但是状态通常包含双重数据（通常会重新加载音乐，它会先显示1-5音乐，然后显示音乐1-10），并且不会将所有音乐都加载到人的手机上，当我使用正常状态时，即会停止一半，即{{ 1}}用户手机上的所有音乐通常都会加载，请问我可能做错了什么 这是我的下面的代码

商店-index.js

this.setState

操作-index.js

import { createStore } from "redux";
import { persistStore, persistReducer } from 'redux-persist'
import storage from 'redux-persist/lib/storage' 
import rootReducer from "../reducers/index";
import autoMergeLevel2 from 'redux-persist/lib/stateReconciler/autoMergeLevel2';
const persistConfig = {
    key: 'root',
    storage,
  //  stateReconciler: autoMergeLevel2,
    timeout: 0,
  }
const persistedReducer = persistReducer(persistConfig, rootReducer)
export default () => {
  let store = createStore(persistedReducer)
  let persistor = persistStore(store)
  return { store, persistor }
}    

Reducers- index.js

export const addSong = song => ({type:
    "ADD_SONG", payload: song
});
export const RESET_ACTION = {
    type: "RESET"
}

App.js

import{ADD_SONG,RESET} from "../constants/action-types";
const initialState = {
    tracks: []
};
const rootReducer = (state = initialState, action) => {
    switch (action.type){
        case ADD_SONG:
        let index = state.tracks.findIndex(tracks => tracks.id == action.payload.id);    
        if(index != -1){
            return state;
        }else{
        return { 
            ...state,
            tracks: [...state.songs, action.payload]
        }
        }
        case RESET:
        return initialState;
        default:
            return state
    }
}
export default rootReducer;

Home.js

import React, { Component } from 'react';
import {
    Platform,
    StyleSheet,
    Text,
    Image,
    Dimensions,
    StatusBar,
    ScrollView,
    View,
    DeviceEventEmitter,
    FlatList,
    ActivityIndicator,
    AsyncStorage
} from 'react-native';
import Splash from './components/Splash';
import Home from './components/Home';
import MusicFiles from 'react-native-get-music-files';
import Permissions from 'react-native-permissions';
import { PersistGate } from 'redux-persist/integration/react';
//import store from "./store/index";
import index from './store/index';
const {store, persistor} = index();
import {connect, Provider} from 'react-redux';
import {addSong, RESET_ACTION
} from "./actions/index";

const mapStateToProps = state => {
    return {
        tracks: state.tracks
    };
};
const mapDispatchToProps = dispatch => {
    return {
      addSong: song => dispatch(addSong(song)),
      RESET_ACTION
    };
};

class reduxApp extends Component{
    millisToMinutesAndSeconds(millis) {
        var minutes = Math.floor(millis / 60000);
        var seconds = ((millis % 60000) / 1000).toFixed(0);
        return (seconds == 60 ? (minutes+1) + ":00" : minutes + ":" + (seconds < 10 ? "0" : "") + seconds);
      }
           componentDidMount() {
            this.props.RESET_ACTION;   
            this.setState({loaded: false});
            if(this.props.songs && this.props.songs.length > 0){
            this.setState({loaded: true})    
            }else{
            this.musicGetter();    
            }


           }
           musicGetter(){
            Permissions.request('storage').then(response => {
                this.setState({ photoPermission: response })
              })
              MusicFiles.getAll({
                  id : true,
                  blured : false,
                  artist : true,
                  duration : true, //default : true
                  cover : true, //default : true,
                  title : true,
                  cover : true,
                  batchNumber : 1, //get 5 songs per batch
                  minimumSongDuration : 10000, //in miliseconds,
                  fields : ['title','artwork','duration','artist','genre','lyrics','albumTitle']
                })
           }
           componentWillMount() {
        /*    DeviceEventEmitter.addListener(
                'onBatchReceived',
                (params) => {
                    this.setState({songs : [
                        ...this.state.songs,
                        ...params.batch
                    ]},this.setState({loaded: true}));
                }
            );*/
            DeviceEventEmitter.addListener(
                'onBatchReceived',
                (params) => {
                    console.log(params.batch);
                    this.props.addSong(params.batch);
                    this.setState({loaded: true});
                }, 
            );

        }
      async  asynccer(){

            try {
                await AsyncStorage.setItem('@MySuperStore:songs', JSON.stringify(this.state.songs));
              } catch (error) {
                // Error saving data
              }
        }
    constructor(props) {
        super(props);
        this.state = {
            timePassed: false,
            photoPermission: '',
            songs: [], 
            loaded: true,
            loading: false
        };
    }
  render() {
    if (!this.state.loaded) {
        return (
            <Splash/>
           );
    } else {
        return (
            <View style={styles.linearGradient}>
            <Provider store={store}>
            <PersistGate loading={null} persistor={persistor}>
            <Home songs={this.props.tracks}/>
            </PersistGate>
            </Provider>
            </View>
        );

    }
}
}
function connectWithStore(store, WrappedComponent, ...args) {
    var ConnectedWrappedComponent = connect(...args)(WrappedComponent)
    return function (props) {
      return <ConnectedWrappedComponent {...props} store={store} />
    }
  }
  const App = connectWithStore(store, reduxApp,mapStateToProps, mapDispatchToProps);
  export default App;