关于javascript:anytype-傻瓜化操作-json数据生成typescript类型

25次阅读

共计 761 个字符,预计需要花费 2 分钟才能阅读完成。

明天给大家介绍 ”any-type”, 一个 vscode 插件, 他能够依据 javascript 字面量生成 typescript 类型.

🔥应用场景

在 ts 中, axios 申请的数据, 为了前面的操作, 咱们都是要手动标注类型的, 比方:

const response = await http.get<ResponseData>("/summary");

这里 ”ResponseData“ 类型就是对接口的形容. 上面模仿一个销量统计接口.

{
    "code":200, 
    "data": [{"name": "拼多多", "salesCount":"9999"},
        {"name": "阿里巴巴", "salesCount":"8888"},
        {"name": "京东", "salesCount":"7777"},
    ]
}

其类型形容:

type ResponseData = {
  code: number;
  data: {name: string; salesCount: string}[];};

能够预想到: “接口越简单, 类型就越简单“.

⚡any-type

这种类型咱们能够通过 ”any-type” 生成. 操作也很简略:

  1. 按 ”F1“ 键, 在控制台 输出 ”generate” 找到 ”⚡ generate typescript type (生成 ts 类型)”, 回车.
  2. 在新弹出的 输入框中输出JSON 数据.
  3. 回车, “ 类型 ” 会主动插入类型到编辑器.

🌈装置

在 vscode 商店中搜寻 ”any-type“.

⭐github

如果你感觉 any-type 不错, 请给我个小小的 star 吧. 😁
https://github.com/any86/any-…

打算

  • [x] 输出接口地址, 发动 http 申请, 解析返回值.

🍭有更好的想法请留言

🍕学习互动

感激大家的浏览, 如有疑难能够加我微信, 我拉你进入 微信群(因为腾讯对微信群的 100 人限度, 超过 100 人后必须由群成员拉入)

正文完
 0