javascript - typescript 泛型定义依赖

标签 javascript reactjs typescript generics

我想定义一个泛型类,如 Table <t>其中 T 是表将绑定(bind)到的数据结构的接口(interface)。

因此该类将有一个类型为返回 Promise <t> 的函数.

但我还需要能够作为 props 传入,带有标签的列列表,它们是否可排序等。

此列列表需要与 <t> 的定义紧密耦合 即,如果我对 <t> 的定义是

{
   id: string,
   description: string,
   createdDate: Date
}

然后需要放入的列的列表必须是 3 列的列表,每列的键都是 id , descriptioncreatedDate分别。

我如何使用 Typescript 和 T 定义该列列表,以便如果您发送的列与 T 的定义不匹配,则编译失败。

谢谢

最佳答案

最简单的解决方案是不使用列表。对象字面量是更好的选择,因为它已经检查过没有重复出现,并且映射类型可以很容易地用于创建基于 T 的新类型,该类型将具有相同的键但具有不同的类型:

interface Columns {
    id: string,
    description: string,
    createdDate: Date
}

interface IColumnDescription {
    name: string;
    // other props
}

class Table<T> {
    constructor(columns: Record<keyof T, IColumnDescription>) {

    }
}

new Table<Columns>({
    createdDate: { name: "Created Date" },
    description: { name: "Description" },
    id: { name: "Id" },
})

我们也可以用列表来做,但只是开始查看问题所在。我们可能需要一个静态方法来创建表,因为我们需要额外的类型参数来获取列列表的类型。

此外,代码完成可能会更好地与对象文字解决方案一起工作,这对开发体验很重要。

关于javascript - typescript 泛型定义依赖,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52497307/

相关文章:

Angular & RX : improved subscription collection

javascript - 在 React 中将 props 传递给 child

javascript - animate d3.js 折线图路径退出

javascript - 根据回调函数对对象进行分组

javascript - 如何修复未捕获的类型错误 : Cannot read property 'name' of undefined

javascript - 如何使用 react.js 在 Apache 服务器上生成动态 &lt;meta&gt; 标签

javascript - jQuery post 到另一个 javascript 函数中

javascript - 我如何使用 jQuery 获取输入类型 radio 的值该值包含空格

reactjs - react JS : How to hide/show tabs?

javascript - React-bootstrap-typeahead 的自定义 Typescript 定义