我正在嘗試從后端匯入資料,但由于命名約定,我的變數名稱之一已關閉。如果我使用setEvents(results.data.events),我會得到除了一個欄位之外的所有內容。但是,當我嘗試回圈遍歷它以手動分配它時,它給了我一個雙重串列,打字稿不允許我從中選擇我的資料。有人能指出這應該怎么做嗎?
import { useEffect, useState } from "react";
import axios from 'axios';
type eventType = {
id: number,
slug: string,
name: string,
date: string,
eventLevel: string,
notes: string
}
export const Events = () => {
const [events, setEvents] = useState<[
eventType
]>([{
id: 999,
slug: '',
name: '',
date: '',
eventLevel: '',
notes: ''
}]);
useEffect(() => {
const getData = async () => {
const result = await axios.get('event/', {withCredentials: true})
setEvents(result.data.events.map((value: any, key: number) => [{
id: key,
slug: value.slug,
name: value.name,
date: value.date,
eventLevel: value.event_level,
notes: value.note
}])) // I think my issue is here but I break it if I remove the []
}
getData()
}, []);
return(
{Object.entries(events).map(([key, value]) => (
<div key={key} className='container'>
<a href={'/journal/events/' value.slug}>
<h2>{value.name}</h2>
<p><b>Date: </b>{ value.date}</p>
<p><b>Event Type: </b>{value.eventLevel}</p>
<p><b>Notes:</b></p>
<p>{value.notes}</p>
</a>
<p>key: {key}</p>
<p>value: {JSON.stringify(value)}</p>
</div>
)
}
uj5u.com熱心網友回復:
我猜這會解決它:
setEvents(result.data.events.map((value: any, key: number) => {
return {
id: key,
slug: value.slug,
name: value.name,
date: value.date,
eventLevel: value.event_level,
notes: value.note
}
})
)
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/514931.html
標籤:反应打字稿类型映射
