Jak uzyskać dostęp do zagnieżdżonego pliku za pomocą maszynopisu Pick<>?

map funkcja dotyczy tablic, więc założę, że Twoje products klucz w twoim przykładzie jest tablicą, a nie obiektem.

Po pierwsze, sugeruję prawidłowe napisanie definicji typu odpowiedzi na produkty, jeśli jeszcze tego nie zrobiłeś

interface IProduct {
  _id: string,
  category: number,
  gender: number,
  title: string,
  description: string,
  price: number,
  imageFileName: string,
  createdAt: string,
  updatedAt: string,
  __v: number
}

interface IResponse {
  _id: string;
  products: IProduct[];
}

Następnie, aby uzyskać Pick praca nad jednym product obiekt, możesz zindeksować IResponse interfejs za pomocą indeksowanych typów dostępu . Chcesz products właściwość w index ponieważ jest to tablica.

/*

Indexed Access Types

type Person = { age: number, name: string }[];
type Age = Person[number]["age"];

*/

type Products = ReadonlyArray<
  Pick<
    IResponse["products"][number],
    "_id" | "gender" | "title" | "description" | "price" | "imageFileName"
  >
>;

Gdybyś miał zrobić coś takiego jak Pick<IResponse["products"], '_id'...> próbowałbyś użyć Pick aby wyodrębnić właściwości z tablicy, co spowodowałoby błąd.

Pozostaje tylko zmapować produkty od odpowiedzi do pożądanego kształtu obiektu.

// Query your products

const { products }: IResponse = {
  _id: "611e2febb863ce74ac448220",
  products: [
    {
      _id: "6116a9ecc3e98d500c5e523d",
      category: 5,
      gender: 1,
      title: 'sivdosi',
      description: 'oisbdvoi',
      price: 2394,
      imageFileName: 'http://localhost:3000/images/1628875244435-3564.png',
      createdAt: "2021-08-13T17:20:44.472Z",
      updatedAt: "2021-08-13T17:20:44.472Z",
      __v: 0
    }
  ]
}

// Get the desired object

const pickedProducts: Products = products.map(({ _id, gender, title, description, price, imageFileName }) => ({
  _id,
  gender,
  title,
  description,
  price,
  imageFileName
}));

Ostateczny wynik wygląda mniej więcej tak, jak poniżej

interface IProduct {
  _id: string,
  category: number,
  gender: number,
  title: string,
  description: string,
  price: number,
  imageFileName: string,
  createdAt: string,
  updatedAt: string,
  __v: number
}

interface IResponse {
  _id: string;
  products: IProduct[];
}

type Products = ReadonlyArray<
  Pick<
    IResponse["products"][number],
    "_id" | "gender" | "title" | "description" | "price" | "imageFileName"
  >
>;

// Query your products

const { products }: IResponse = {
  _id: "611e2febb863ce74ac448220",
  products: [
    {
      _id: "6116a9ecc3e98d500c5e523d",
      category: 5,
      gender: 1,
      title: 'sivdosi',
      description: 'oisbdvoi',
      price: 2394,
      imageFileName: 'http://localhost:3000/images/1628875244435-3564.png',
      createdAt: "2021-08-13T17:20:44.472Z",
      updatedAt: "2021-08-13T17:20:44.472Z",
      __v: 0
    }
  ]
}

// Get the desired object

const pickedProducts: Products = products.map(({ _id, gender, title, description, price, imageFileName }) => ({
  _id,
  gender,
  title,
  description,
  price,
  imageFileName
}));

• Link do placu zabaw TypeScript