打字稿json动态接口

时间:2021-05-07 08:01:43

标签: typescript

我对打字稿很陌生,我想将下面的 json 转换为接口/类型,但 user1 键是动态的,可能有所不同,但 of 键内的 json 将相同。

{
  "code": 200,
  "status": "success",
  "data": {
    "user1": {
       "firstName": "John",
       "lastName": "Smith",
       "age": 25
     }
  }
}

到目前为止我有以下内容。是否可以将数据转换为 Root 界面中的地图,因为这是我在 golang 中的做法。

export interface Root {
  code: number
  status: string
  data: Data
}

export interface Data {
  user1: User1
}

export interface User1 {
  firstName: string
  lastName: string
  age: number
}

干杯,

布雷特

2 个答案:

答案 0 :(得分:0)

您可以使用索引签名:

export interface Root {
    code: number
    status: string
    data: Data
}

export interface Data {
    [key: string]: User
}

export interface User {
    firstName: string
    lastName: string
    age: number
}

答案 1 :(得分:0)

这是我目前使用它的方式,但它不起作用

export interface Root {
    code: number
    status: string
    data: Data
}

export interface Data {
    [key: string]: User
}

export interface User {
    firstName: string
    lastName: string
    age: number
}

export const sendRequest = (url: string): Root => {
  const [data,setData]=useState([]);
  const getData=()=>{
    fetch(url
    ,{
      headers : { 
        'Content-Type': 'application/json',
        'Accept': 'application/json'
       }
    }
    )
      .then(function(response){
        return response.json();
      })
      .then(function(myJson) {
        setData(myJson)
      });
  }
  useEffect(()=>{
    getData()
  },[])
  return JSON.parse(JSON.stringify(data));
}

const user = sendRequest(host + path) 

console.log(user.data?.[0])