reactjs - Redux useSelect 未按预期获取所有数据

问题描述

我正在尝试从我的数据库中打印数据。使用钩子和没有钩子都做得很好，所以这次我尝试使用 redux 和钩子来实现 CRUD。但那是返回一个未定义的每次渲染。所以我调用了有效载荷，它是一个对象数组。我正在使用 redux、中间件 Thunk 和钩子。请有人指导我解决这个问题。

这是下面的代码：

组件.jsx

import { retrieveCars } from '../action/cars.action'
    
     const cars = useSelector(state => state.cars);
        const dispatch = useDispatch();
      
        useEffect(() => {
          dispatch(retrieveCars());
          


        });
 <tbody>
                    {cars &&
                      cars.map((data) =>
                        <tr key={data.idCars}>
                       
                        <th scope="row">{data.idCars}</th>  
                      
                      <td>{data.carName}</td>
                      <td>{data.carModel}</td>
                      <td>
                      <Link to={"/classement/update/" + data.idCars}
                        className="btn btn-info"
                        >
                        Edit
                       </Link>
                
                      <button  className="btn btn-danger" onClick={() => deleteC(data.idCars)}>
                        Remove
                      </button>
                        </td> 
                     
                      
                     
                      </tr>
                    )
                    }
                      
                
                  </tbody>
        **cars.action.js**
export const retrieveCars = () => async (dispatch) => {
    try {
      const res = await DataService.getAll();
  
      dispatch({
        type: RETRIEVE_CARS,
        payload: res.data,
      });
    } catch (err) {
      console.log(err);
    }
  };

汽车减速机：

const initialState = [];
  
  function carReducer(cars = initialState, action) {

    const { type, payload } = action;
  
    switch (type) {    
      case RETRIEVE_CARS:


           return payload;
   default:
        return cars;
    }

Store.js

import rootReducer from '../reducers/carReducer';
const initialState = {};

const middleware = [thunk];

const store = createStore(
  rootReducer,
  initialState,
  composeWithDevTools(applyMiddleware(...middleware))
);

export default store;

标签： reactjsreact-reduxaxiosreact-hooksredux-thunk

我看到你正在使用carReducerfor rootReducer。carReducer只有状态是一个数组。state空数组也是如此，并且state.cars未定义。

只需像这样更新即可获得汽车：

const cars = useSelector(state => state);

reactjs - Redux useSelect 未按预期获取所有数据

问题描述

解决方案

推荐阅读