React Native使用Redux Toolkit读取本地对象数据时setData未定义

错误根源 #

你在HomeScreen里的两处错误导致了这个问题：

1. 错误导入了localObjectSlice：你从../redux/store导入的是store实例，而非slice对象，所以localObjectSlice.actions不存在，自然找不到setData方法。
2. 明明已经从reducer文件正确导入了setData，却没有在dispatch逻辑里使用它。

修复方案 #

1. 修正HomeScreen的代码 #

替换错误的导入和dispatch调用，直接使用从reducer导入的setData：

import {useSelector, useDispatch, useEffect} from "react-redux";
import {setData} from "../redux/reducer";
import { View, Text } from 'react-native';

export default function HomeScreen({navigation}) {

  const localObject = {
    data: [
      {id: 1, name: "Item 1"},
      {id: 2, name: "Item 2"},
      {id: 3, name: "Item 3"},
    ],
  };
  const data = useSelector(state => state.localObject.data);
  const dispatch = useDispatch();
  
  useEffect(() => {
    // 直接调用导入的setData action creator
    dispatch(setData(localObject.data));
  }, []);

  return (
    <View style={{alignItems: "center"}}>
      <View>
        {data.map(item => (
          <Text key={item.id}>{item.name}</Text>
        ))}
      </View>
    </View>
  );
}

2. 验证其他文件的正确性 #

你的reducer.js和store.js写法是正确的：

• reducer文件通过createSlice创建了slice，正确导出了setData action和reducer
• store文件正确注册了reducer，命名为localObject，所以useSelector(state => state.localObject.data)的取值逻辑没问题

额外注意事项 #

• 确保你的根组件（比如App.js）已经用Provider包裹了store，否则Redux无法正常工作：

import { Provider } from 'react-redux';
import store from './redux/store';
import HomeScreen from './screens/HomeScreen';

export default function App() {
  return (
    <Provider store={store}>
      <HomeScreen />
    </Provider>
  );
}

• 用Redux解决大量数据的跨组件传参卡顿问题是合理的，这个方向没问题。

内容的提问来源于stack exchange，提问作者houcin olmostaf