Question

我已经尝试过AsyncStorage，react-native-store和react-native-simple-store，它们都在模拟器中工作，但不在设备上工作。我正在使用redux和redux-thunk来加载存储状态。我在root组件的componentDidMount方法中调用以下函数（使用react-native-simple-store）：

export function loadState() {
  return (dispatch, getState) => {
    store.get('state').then((state) => {
      if (state) {
        let action = {
          type: LOAD_STATE,
          state: fromJS(state),
        };
        dispatch(action);
      } else {
        store.save('state', initialState);
      }
    }).catch((error) => {
      console.log(error);
    });
  };
}

然后在我的reducer中，当用户触发更新时，我会在返回新状态之前更新存储状态，如下所示：

case SET_UPDATED_DATE:
  newState = state.set('updatedDate', action.date);
  store.update('state', newState.toJS())
    .catch((error) => console.log(error));
  return newState;

初始化/更新方法是否不足？是否需要为设备设置特殊功能？或者在设备上运行时不支持redux-thunk - main.jsbundle或开发服务器 - （在loadState函数的返回函数顶部放置一条日志语句会让我相信它在设备上可能没有被调用）？

Answer 1

按照AsyncStorage docs'示例，我找到了一种方法让它工作。在我的reducer文件中（我的redux状态是一个Immutable.js对象）：

var STORAGE_KEY = '@AppName:state';

export function loadState() {
  return async (dispatch, getState) => {
    try {
      var value = await AsyncStorage.getItem(STORAGE_KEY);
      if (value !== null) {
        dispatch(replaceState(value));
        console.log('Recovered selection from disk:');
        console.log(value);
      } else {
        saveState(JSON.stringify(initialState.toJS()));
        console.log('No state on disk. Initialized with initialState.');
      }
    } catch (error) {
      console.log('AsyncStorage error: ' + error.message);
    }
  };
}

function replaceState(newState) {
  return {
    type: REPLACE_STATE,
    newState: fromJS(JSON.parse(newState)),
  };
}

async function saveState(state) {
  try {
    await AsyncStorage.setItem(STORAGE_KEY, state);
    console.log('Saved selection to disk:');
    console.log(state);
  } catch (error) {
    console.log('AsyncStorage error: ' + error.message);
  }
}

然后在reducer函数中：

case SET_UPDATED_DATE:
  newState = state.set('updatedDate', action.date);
  saveState(JSON.stringify(newState.toJS()));
  return newState;

React Native：存储仅适用于模拟器

1 个答案: