React-Native Redux-Thunk应用报错'actionTypes is undefined'求助

Hey there, sorry to hear you've been stuck on this for days—let's break down this actionTypes is undefined error step by step. Since your app is small, it shouldn't take long to track down the root cause!

First, let's go through the most common culprits for this error:

1. Mismatched Import/Export of actionTypes #

This is the #1 reason for this kind of issue. Double-check these critical points:

• In your action creator or reducer file, confirm you're importing actionTypes correctly. For example, if your action types live in a separate actionTypes.js file, your import should align with how you're exporting them:

  // If using default export in actionTypes.js
  import actionTypes from './actionTypes';
  

  Or for named exports:

  // If using named exports in actionTypes.js
  import { UPDATE_VALUE, RESET_VALUE } from './actionTypes';
  

• Verify your actionTypes file is actually exporting values properly. A default export might look like:

  // actionTypes.js
  export default {
    UPDATE_VALUE: 'UPDATE_VALUE',
    RESET_VALUE: 'RESET_VALUE'
  };
  

  And a named export setup would be:

  // actionTypes.js
  export const UPDATE_VALUE = 'UPDATE_VALUE';
  export const RESET_VALUE = 'RESET_VALUE';
  

  Mixing default and named imports/exports is an extremely common mistake—make sure they match perfectly!

2. Typos or Path Errors #

Even a tiny typo can break everything:

• Check that the file path in your import matches the actual location of actionTypes.js (note: file paths are case-sensitive on Linux/macOS!)
• Make sure you didn't misspell actionTypes anywhere—like writing actionType (missing an 's') in your import or when referencing it in code.

3. Accidental Missing Import #

The error message points to a specific line where actionTypes is undefined. Head straight to that line and ask:

• Did I forget to import actionTypes into this file entirely?
• If I'm destructuring from actionTypes, is the property name spelled correctly? For example:

  // Wrong if actionTypes uses ALL_CAPS naming
  const { updateValue } = actionTypes;
  

4. Circular Dependencies (Less Likely, But Possible) #

Since your app only has a few files, this is rare, but worth checking: if your reducer imports from action creators, and action creators import from actionTypes, and the reducer also imports from actionTypes in a way that creates a loop, it can cause undefined values. Simplify your imports to avoid circular references.

Quick Example of a Correct Setup #

To help you cross-reference, here's a working minimal setup:
actionTypes.js

export default {
  UPDATE_COUNT: 'UPDATE_COUNT'
};

actions.js

import actionTypes from './actionTypes';

export const updateCount = (count) => {
  return {
    type: actionTypes.UPDATE_COUNT,
    payload: count
  };
};

reducer.js

import actionTypes from './actionTypes';

const initialState = { count: 0 };

const counterReducer = (state = initialState, action) => {
  switch(action.type) {
    case actionTypes.UPDATE_COUNT:
      return { ...state, count: action.payload };
    default:
      return state;
  }
};

export default counterReducer;

Give these checks a go—chances are it's a simple import/export or typo issue that's easy to fix once you spot it!

内容的提问来源于stack exchange，提问作者Joey Rodrigues