Reducer中的流类型故障？

Question

我很确定我正确地遵循了有关如何输入动作和减速器的说明：

ActionTypes.js

// @flow
import type Product from "../../models/Product";

type ActionNamesObject = {
  [key: string]: { [key: string]: { [key: string]: string } }
};

export const Actions: ActionNamesObject = {
  Product: {
    Fetch: {
      start: "PRODUCT_FETCH_START",
      success: "PRODUCT_FETCH_SUCCESS"
    }
  }
};

export type ProductAction =
  | { type: "PRODUCT_FETCH_START" }
  | {
      type: "PRODUCT_FETCH_SUCCESS",
      products: Product[]
    };

减速器

// @flow
import type Product from "../../models/Product";
import type { ProductAction } from "../actions/ActionTypes";
import { Actions } from "../actions/ActionTypes";

type ProductState = {
  +products: Product[]
};

const initialState = {
  products: []
};

export default function productsReducer(
  state: ProductState = initialState,
  action: ProductAction .   // LINE 16
): ProductState {
  switch (action.type) {
    case Actions.Product.Fetch.success:
      return { ...state, products: action.products };   // ERROR HERE
    default:
      (action: empty);   // ERROR HERE
      return state;
  }
}

但是在reducer文件中标记了流错误的地方，我遇到了流错误。

第一个错误发生在products上：无法获得action.products，因为对象类型中缺少属性积。参考第16行。 第二个错误发生在action上：无法将操作强制转换为空，因为对象类型与空不兼容。也请参考第16行。

我想念什么？

Answer 1

您的ProductActionType返回两种可能的形状，而没有products

我对打字稿不是很熟悉，但是我想你想要更多类似的东西：

export type ProductAction = {
    type: "PRODUCT_FETCH_START" | "PRODUCT_FETCH_SUCCESS"
    products: Product[]
} 

我不确定是否需要第二行失败的代码。