TypeError: Proxy has already been revoked. No more operations are allowed to be performed on it

1.4k views Asked by At

I use easy-peasy v5 on react-native for the Store and every time I try to call an action within a thunk it throws an error.

fetch: thunk(async (actions, teamId, { getStoreActions }) => {
    // get data of all items
   /* ... */
    try {
      getStoreActions().account.users.fetched(...);
    } catch (e) {
      console.log("Store Error (teams/fetch) 93 ", e);
    }

    try {
      actions.fetchedMembers(...);
    } catch (e) {
      console.log("Store Error (teams/fetch) 101 ", e);
    }
    // get teams by id, and the ids
    /* ... */
    // update store data
    try {
      actions.fetched(...);
    } catch (e) {
      console.log("Store Error (teams/fetch) 114 ", e);
    }
    return data;
  }),

This thunk call outputs:

Store Error (teams/fetch) 93  [TypeError: Proxy has already been revoked. No more operations are allowed to be performed on it]
Store Error (teams/fetch) 101  [TypeError: Proxy has already been revoked. No more operations are allowed to be performed on it]
Store Error (teams/fetch) 114  [TypeError: Proxy has already been revoked. No more operations are allowed to be performed on it]

The issue doesn't occur the first time (after clearing all cache and storage), but occurs on every consecutive launch. I'm using easy-peasy's persist function on react-native with AsyncStorage.

The number of errors are somehow fewer without persist.

Additional settings I've had to enable for persistence to work properly:

  • setAutoFreeze: false
  • window.requestIdleCallback: null
1

There are 1 answers

0
Link On

I have met the same error on React Native iOS and fixed it. Try not return new immutable instances of your state, just make a mutation as below:

  addItem: action((state, payload) => {
    const itemId = payload;
    // ✌ modify the array or other value directly like:
    state.items.push(itemId);
    // ❌ rather than return new state
    // return {
    //   ...state,
    //   items: [...state.items, itemId],
    // };
  }