TS 定义数据格式

最新推荐文章于 2023-06-22 14:40:21 发布

逆风优雅

最新推荐文章于 2023-06-22 14:40:21 发布

阅读量415

点赞数

分类专栏： tpyescript 文章标签： typescript

本文链接：https://blog.csdn.net/qq_44603011/article/details/128581209

版权

tpyescript 专栏收录该内容

24 篇文章 2 订阅

订阅专栏

文章展示了如何在TypeScript中定义和使用接口（interface），包括可选属性和数组对象的定义，以IMenu和IMenus为例，构建了一个层次结构的数据结构，用于描述菜单系统。

摘要由CSDN通过智能技术生成

/* // interface 表示接口的意思，可以定义这个数据返回什么样的数据类型
interface Abc{
    id:number,
    name:string
}
var obj:Abc = {
    id:10,
    name:'123'
} */

// 定义接口：接口的名字的首字母 最好写成I 开头，对应interface的首字母 ，表示是接口的意思
interface IMenu{ // 定义的是最内层的menus 对应的每一页
    name:string,
    key:string,
    icon?:any // 表示icon 是一个可选的属性，any表示类型可以为任意类型
}
interface IMenus{ // 定义的是最外层的数据结构
    name:string,
    menus:IMenu[] // 表示menus为一个数组 对象
}
export function userMenu() {
    const menus:IMenus[]=[   // 表示menus是一个数组，数组里面的每项 遵循 IMenus 定义的格式 ，在IMenus中的IMenu 也是一个对象，IMenu中的每项 遵循IMenu 定义的格式
        {
            name:'在线音乐',
            menus:[
                {
                    name:'推荐',
                    key:'discover',
                    icon:''
                },
                {
                    name:'音乐馆',
                    key:'music',
                    icon:''
                },
                {
                    name:'视频',
                    key:'video',
                    icon:''
                },
                {
                    name:'电台',
                    key:'djs',
                    icon:''
                },
            ]
        },
        {
            name:'我的音乐',
            menus:[]
        }
    ]

    return {
        menus
    }
}