reactjs – 如何在用TypeScript(TSX)编写的React应用程序中使用F

发布时间：2020-12-15 16:15:59 所属栏目：百科来源：网络整理

导读：我想在 React中编写一个新的Web应用程序,它使用 Relay与 GraphQL服务器通信.最近 JSX support是为 TypeScript推出的.但是在 DefinitelyTyped没有用于Relay的打字声明文件(.d.ts).如何在不必先为Relay写入打字文件的情况下在TypeScript中编写我的应用程序？

我想在 React中编写一个新的Web应用程序,它使用 Relay与 GraphQL服务器通信.最近 JSX support是为 TypeScript推出的.但是在 DefinitelyTyped没有用于Relay的打字声明文件(.d.ts).如何在不必先为Relay写入打字文件的情况下在TypeScript中编写我的应用程序？

解决方法

Typescript不要求你为你使用的所有库都打字,强烈推荐.要使用没有打字的接力：

import * as React from "react"
let Relay = require("react-relay")

interface HelloProps extends React.Props<HelloComponent> {
  viewer: {
    message: string
  }
}

class HelloComponent extends React.Component<HelloProps,void> {
  render() {
    return <div>Hello { this.props.viewer.message }</div>
  }
}

let Hello = Relay.createContainer(HelloComponent,{
  fragments: {
    viewer: () => Relay.QL`fragment on Viewer { message }`
  }
})

然后使用Hello作为常规中继组件.想法是require是一个接受字符串并返回任何字符串的函数,因此您可以像在vanilla Javascript中那样使用Relay变量.

如果您没有使用Node.JS类型,则可能需要为require添加类型.在d.ts文件的某处,添加：

interface NodeRequireFunction {
  (id: string): any;
}

declare var require: NodeRequireFunction;

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!