reactjs 如何在react js typescript中获取数组内部类型数组不获取id的类型

2izufjch 于 2023-05-28 发布在 React

关注(0)|答案(1)|浏览(124)

interface UserData {
        id:number;
        question: string;
        updated_at: string;
        deleted_at: string;
        old_question_id: string;
        horizontal: number;
        type_id: number;
        solving_explanation:string;
        user_id:string;
        difficulty_level:string;
        explanation_image_id:string;
        type:any[]
            
    };

   

     const [question, setQuestion] = useState<UserData[]>([]);

API响应

"data": [
            {
                "id": 1,
                "question": "<p>1 sduhfsugn b</p>",
                "created_at": "2023-05-23T05:56:33.000000Z",
                "updated_at": "2023-05-23T05:56:33.000000Z",
                "deleted_at": null,
                "old_question_id": null,
                "horizontal": 0,
                "difficulty_level_id": null,
                "type_id": 1,
                "solving_explanation": "<p>rewsna enifederp si sihT</p>",
                "user_id": "3df2d014-36e6-4276-8ab6-eba8e2bedfd3",
                "difficulty_level": "1",
                "explanation_image_id": null,
                "type": {
                    "id": 1,
                    "name": "text box"
                },
                "options": [],
                "image": null,
                "option_images": [],
                "collections": [
                    {
                        "id": 1,
                        "cover": "<p>This is test&nbsp;</p>",
                        "created_at": "2023-05-23T11:25:00.000000Z",
                        "updated_at": "2023-05-23T11:25:00.000000Z",
                        "deleted_at": null,
                        "old_collection_id": null,
                        "explanation": "This is test cluster",
                        "file": null,
                        "difficulty_level_id": null,
                        "type_id": 5,
                        "head_title": "Test 1",
                        "user_id": "3df2d014-36e6-4276-8ab6-eba8e2bedfd3",
                        "difficulty_level": "2",
                        "pivot": {
                            "question_id": 1,
                            "collection_id": 1
                        }
                    }
                ]
            },

如何获取所取键值类型

{question.map((i) => (
  console.log(i.type.id)
))}

类型ID未匹配

reactjs

来源：https://stackoverflow.com/questions/76346766/how-to-get-array-inner-type-array-in-react-js-typescript-not-fetch-type-of-id

1条答案

按热度按时间

jljoyd4f1#

您可以使用可选的链接来获取值：

{question.map((i) => (
  console.log(i?.type?.id) // Accessing id with optional chaining
))}

或

{question.map((i) => (
  console.log(i.type && i.type.id)
))}

可选链接是typescript/javascript的一项功能，即使嵌套，也可以安全地访问对象属性。

同样在上面的接口中，为什么你定义type:any[]作为你得到的对象作为响应。将其更改为type:any
或

type: {
    id: number;
    name: string;
  };

赞(0）回复(0）举报 2023-05-28

我来回答

reactjs 如何在react js typescript中获取数组内部类型数组不获取id的类型

1条答案

相关问题

热门标签

最新问答