使用打字稿过滤对象键

Question

这是一个显示问题的沙箱。https://codesandbox.io/s/trusting-moon-n058k?file=/src/index.ts

输入：

data.types = {
        starter: true,
        main: false,
        side: false,
        dessert: true,
        drink: false
    }

期望的输出：

recipe.types = ["starter", "dessert"]

解决方案：

type NewRecipeFormValues = {
    types: {
        starter: boolean,
        main: boolean,
        side: boolean,
        dessert: boolean,
        drink: boolean
    }
}

const postNewRecipe = (data: NewRecipeFormValues) => {
  let recipe = JSON.parse(JSON.stringify(data));
  recipe.types = Object.keys(data.types).filter(
    (key: keyof NewRecipeFormValues["types"]) => data.types[key]
  );
};

问题：无论我使用什么类型，Typescript 都不会关闭。

任何帮助将不胜感激，因为我失去了理智

Answer 1

发生错误的原因是编译器无法推断 的运行时类型，key因为Object.keys可以返回不一定是类型的任意字符串列表keyof NewRecipeFormValues["types"]。

因此，你需要显式地告诉编译器这key确实是keyof NewRecipeFormValues["types"]这样，以便它能够冷静下来。

为此，请使用类型断言。

type NewRecipeFormValues = {
  types: {
    starter: boolean;
    main: boolean;
    side: boolean;
    dessert: boolean;
    drink: boolean;
  };
};

const postNewRecipe = (data: NewRecipeFormValues) => {
  let recipe = JSON.parse(JSON.stringify(data));
  recipe.types = Object.keys(data.types).filter(
    (key) => data.types[key as keyof NewRecipeFormValues["types"]]
  );
};

检查一下这个游乐场。

至于为什么不能使用key: keyof NewRecipeFormValues["types"]语法，链接文档解释得更好。