向组件添加接口子类型

【问题标题】：Add an interface subtype to a component向组件添加接口子类型
【发布时间】：2018-09-01 13:49:45
【问题描述】：

我想给一个组件添加一个“接口子类型”，例如：

@Component
export default class Graph extends Vue
{

    @Prop ()
    public data: Array<Graph.Data> ;

}

带有如下子接口：

export interface Data
{
    time: Date
    value: number
}

为了强制调用者提供正确格式的道具：

<graph :data="data" />

这里data 是Array<Graph.Data> 类型。

有什么想法吗...？

【问题讨论】：

标签： typescript vue.js vuejs2 vue-component

【解决方案1】：

TypeScript 不支持内部接口，但是你可以使用namespace/module 来实现你想要的：

@Component
class Graph extends Vue
{

    @Prop()
    public data: Array<Graph.Data>;

}
namespace Graph {
    export interface Data  {
        time: Date
        value: number
    };
}
export default Graph;

// example variable
var someData: Array<Graph.Data> = [];

见TypeScript playground demo。

【讨论】：