1

我正在尝试redux-orm,根据我所能收集到的信息,redux-orm 在 store 中创建了一个对象,其键是通过Model.name, 为每个注册模型指定的值。

好吧,为了创建我的“实体”减速器,我使用combineReducers,为我的所有实体传递减速器,如下所示:

import { combineReducers } from 'redux';
import City from './cityReducer';
import Poi from './pointOfInterestReducer';

const entitiesReducer = combineReducers({
  City,
  Poi
});

export default entitiesReducer;

在此处输入图像描述

最后这就是我创建我的方式rootReducer,也使用combineReducers

在此处输入图像描述

问题是,我认为,通过使用combineReducers我复制商店中的密钥,如下所示:

在此处输入图像描述

您知道如何避免这种情况,并让我的所有模型都是“实体”的直接后代吗?

entities>City喜欢和不喜欢的东西entities>City>City

编辑:cityReducer.js

import orm from './../../orm/orm';
import * as types from '../../actions/actionTypes';

const loadCities = (state, action) => {
  // Create a Redux-ORM session from our entities "tables"
  const session = orm.session(state);
  // Get a reference to the correct version of model classes for this Session
  const { City } = session;
  const { cities } = action.payload;

  // Clear out any existing models from state so that we can avoid
  // conflicts from the new data coming in if data is reloaded

  City.all().toModelArray().forEach(city => city.delete());


  // Immutably update the session state as we insert items
  cities.forEach(city => City.parse(city));  
  return session.state;
};

const updateCity = (state, payload) => {
  const { id, newItemAttributes } = payload;

  const session = orm.session(state);
  const { City } = session;

  if (City.hasId(id)) {
    const modelInstance = City.withId(id);

    modelInstance.update(newItemAttributes);
  }

  return session.state;
};


const deleteCity = (state, payload) => {
  const { id } = payload;

  const session = orm.session(state);
  const { City } = session;

  if (City.hasId(id)) {
    const modelInstance = City.withId(id);

    // The session will immutably update its state reference
    modelInstance.delete();
  }

  return session.state;
};

const createCity = (state, payload) => {
  const { city } = payload;

  const session = orm.session(state);
  const { City } = session;

  City.parse(city);

  return session.state;
};

const citiesReducer = (dbState, action) => {
  const session = orm.session(dbState);
  switch (action.type) {
    case types.LOAD_CITIES_SUCCESS: return loadCities(dbState, action);
    case types.CREATE_CITY_SUCCESS: return createCity(dbState, action);
    case types.UPDATE_CITY_SUCCESS: return updateCity(dbState, action);
    case types.DELETE_CITY_SUCCESS: return deleteCity(dbState, action);
    default: return session.state;
  }
};

export default citiesReducer;
4

1 回答 1

1

有两种方法可以使用 Redux-ORM 来定义它的“表”结构,并编写 reducer 逻辑来使用这些表。我在我的博客文章Practical Redux, Part 1: Redux-ORM BasicsPractical Redux, Part 2: Redux-ORM Concepts and TechniquesPractical Redux, Part 5: Loading and Displaying Data中给出了这两种方法的示例。(请注意,这些帖子涵盖了 Redux-ORM 0.8 的使用,并且 0.9 版有一些 API 更改。我在Practical Redux, Part 9中列出了这些更改。)

第一种方法是编写附加到模型类的 reducer 逻辑,并使用 Redux-ORMORM实例生成一个 reducer 来创建“表”并为你管理它们。根据Redux-ORM repo 前面的示例

import {createReducer} from "redux-orm";
import {orm} from "./models";

const rootReducer = combineReducers({
    entities: createReducer(orm)
});

另一种方法是编写您自己的创建初始状态的函数,以及可能处理更新的其他函数:

import {orm} from "./models";

const initialState = orm.getEmptyState();

export default function entitiesReducer(state = initialState, action) {
    // handle other actions here if desired
    return state;
}

换句话说,不要自己定义单独的每个模型类型的“表”。让 Redux-ORM 定义这些,或者在它自己的 reducer 中自动定义,或者使用它为你的实体 reducer 生成初始状态。

于 2017-09-01T20:25:59.953 回答