Typescript不定式接口推断自身

Question

我正在寻找一种方法来从这个API响应中创建类型/接口，嵌套的comments属性对我来说是具有挑战性的。

"data": [
{
"id": 1,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:12:25.000000Z",
"updated_at": "2022-06-24T06:12:25.000000Z",
"comments": [
{
"id": 2,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:12:37.000000Z",
"updated_at": "2022-06-24T06:12:37.000000Z",
"comments": [
{
"id": 3,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:32:52.000000Z",
"updated_at": "2022-06-24T06:32:52.000000Z",
"comments": [],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
},
{
"id": 4,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:32:57.000000Z",
"updated_at": "2022-06-24T06:32:57.000000Z",
"comments": [],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
}
],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
}
],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
},
],

Answer 1

export interface Comment {
id: number;
comment: string;
approved: boolean;
archived: boolean;
pinned: boolean;
reported: boolean;
created_at: string;
updated_at: string;
comments: Comment[];
commented: {
id: number;
first_name: string;
last_name: string;
full_name: string;
};
}

Answer 2

Typescript Playground Link

Comment是lib.dom.d.ts的一部分，所以最好用CommentData代替

interface CommentData {
id: number;
comment: string;
approved: boolean;
archived: number;
pinned: number;
reported: number;
created_at: string;
updated_at: string;
comments: CommentData[];
commented: User;
}
interface User {
id: number;
first_name: string;
last_name: string;
full_name: string;
}
interface Data {
data: CommentData[];
}
const data: Data = {
data: [
{
id: 1,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:12:25.000000Z",
updated_at: "2022-06-24T06:12:25.000000Z",
comments: [
{
id: 2,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:12:37.000000Z",
updated_at: "2022-06-24T06:12:37.000000Z",
comments: [
{
id: 3,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:32:52.000000Z",
updated_at: "2022-06-24T06:32:52.000000Z",
comments: [],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
{
id: 4,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:32:57.000000Z",
updated_at: "2022-06-24T06:32:57.000000Z",
comments: [],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
],
};
console.log(data);