TypeScript - 检查未知类型的变量是否具有某些属性答案

【问题标题】：TypeScript - check a variable of type unknown has certain propertyTypeScript - 检查未知类型的变量是否具有某些属性
【发布时间】：2020-11-26 22:00:05
【问题描述】：

我在relay 中使用打字稿，而传递下来的props 是unknown 类型。我尝试了几种方法来说服编译器它可以具有某些属性，但它一直向我显示错误：

<QueryRenderer
  environment={environment}
  query={testQuery}
  variables={{}}
  render={({ error, props }) => {
    if (error) {
      return <div>Error!</div>;
    }
    if (!props) {
      return <div>Loading...</div>;
    }
    if (!!props && _.isObject(props) && props.hasOwnProperty("Messages"))
      return <MessageList messages={props.Messages} />;
  }}
/>;

上面的代码不起作用，打字稿仍然警告我

“对象”类型上不存在属性“消息”。

如何让这个简单的示例运行起来又不让我的代码看起来很丑陋？非常感谢！

【问题讨论】：

<MessageList messages={ (props as { Messages : string }).Messages } />
@januwa 很快，很好，谢谢！
我遇到了同样的问题。您应该能够在没有类型断言的情况下解决此问题 (as)。根据文档，它应该知道正确的类型，但我也得到了类型为 unknown relay.dev/docs/en/type-emission 的道具

标签： reactjs typescript relay

【解决方案1】：

您应该从查询中注释特定的 GraphTaggedNode。这将是来自 testQuery 变量的查询名称。在下面的示例中，我将其称为 TestQuery。但它应该以 FileName_Query 为前缀，以帕斯卡大小写。

您的props 现在应该使用TestQueryResponse 进行注释。

<QueryRenderer<TestQuery>
  ...
 />

【讨论】：