Question

**您好！我的问题是我的状态是不上传，总是空的，尽管我的行为带来数据正确。谁能给我一些帮助，说明我做错了什么？我认为是名称或联合减速器部分。也许我没有使用我的减速机或类似的东西来访问数据** 我从api调用中收到的对象具有此格式{categories: Array(4), items: Array(50)}

组件

    import React, { PureComponent } from 'react';
    import { connect } from 'react-redux';
    import { bindActionCreators } from 'redux';
    import ItemList from '../components/ItemList/ItemList';
    import { getItems } from './actions'
    class ItemListContainer extends PureComponent {

      async componentDidMount() {
        const { getItems } = this.props;
        await getItems()

        console.log(this.props)
      }

      render() {
        return <ItemList />;
      }
    }

    const mapStateToProps = state => (
      {
      items: state.items.items,
    });

    const mapDispatchToProps = dispatch =>
      bindActionCreators(
        {
          getItems,
        },
        dispatch,
      );

    export default connect(mapStateToProps, mapDispatchToProps)(ItemListContainer);

actions.js

export const GET_ITEMS = 'GET_ITEMS';
export const GET_ITEM = 'GET_ITEM';
export const GET_ITEM_DESCRIPTION = 'GET_ITEM_DESCRIPTION';

export function getItems(query) {
    return async function (dispatch) {
        // const res = await fetch(`http://localhost:3000/api/items?q=${query}`)
        const res = await fetch(`http://localhost:3000/api/items?q=ipad`)
        const items = await res.json()
        return dispatch({
            type: 'GET_ITEMS',
            items: items.items,
        })
    }
}

reducer.js

import { GET_ITEMS } from './actions';

const initialState = {
  items: [],
  itemsLoaded: false,
};

export default function(state = initialState, action) {
  const { type, data } = action;

  switch (type) {
    case GET_ITEMS:
      return {
        ...state,
        items: data,
        itemsLoaded: true,
      };
    default: {
      return {
        ...state
      }
    }
  }
}

Answer 1

我正在访问reducer中的{data}，当然它是空的。 correnct行动是项目。

动作完成后，redux状态不会更新

1 个答案: