使用React Redux钩子，React应用程序中不会调用Redux reducer

Question

我刚开始用钩子处理react redux，但我的reducers似乎没有通过。我正在遵循官方文档。这里有我遗漏的东西吗？我已经验证了我正在从后端获取数据，但它不会到达这里的reducer。

下面是我的组件

import React, { useState, useEffect, useRef } from "react";
import { useDispatch } from 'react-redux';
import {getBikeInfo} from  './features/counter/getInfo/getDetails.js'
function App() {
const dispatch = useDispatch();
const mapContainer = useRef(null);
useEffect(() => {
dispatch(getBikeInfo())
}, [])
useEffect(() =>{
}, [])
return (
<div className="district-map-wrapper">
<div id="districtDetailMap" className="map">
<div style={{ height: "100%" }} ref={mapContainer}>
</div>
</div>
</div>
);
}
export default App;

下面是我的切片(thunk+reducer文件(

import { createSlice } from "@reduxjs/toolkit";
import axios from "axios";
export const getDetails = createSlice({
name: "getInfo",
initialState: {
value: 0
},
reducers: {
bikeParkingInfo: (state, action) => {
console.log("something");
console.log(state);
},
collisionDetailInfo: (state, action) => {
state.value -= 1;
}
}
});
export const { bikeParkingInfo } = getDetails.actions;
export const getBikeInfo = (dispatch) => {
return async (dispatch, getState) => {
try {
// make an async call in the thunk
const bikeParking = await axios.get(
"http://127.0.0.1:8000/getBikeParkingDetailsFromDb"
);
//console.log(bikeParking)
// dispatch an action when we get the response back
dispatch(bikeParkingInfo(bikeParking.payload));
} catch (err) {
// If something went wrong, handle it here
}
};
};
export default getDetails.reducer;

Answer 1

我知道我缺少了什么，我不得不在我的store.js上注册这个reducer，就像这个一样

import { configureStore } from '@reduxjs/toolkit';
import counterReducer from '../features/counter/counterSlice';
import getInfoReducer from '../features/counter/getInfo/getDetails'
export default configureStore({
reducer: {
counter: counterReducer,
bikeInfo : getInfoReducer,
//collisionInfo : collisionInfoReducer
},
});

然而，我的响应数据显示未定义，尽管是从服务器获得的