React中对象中的双管道的目的是什么 [英] What is the purpose of a double-pipe in an object in React

问题描述

我遇到了一些React DND的示例，其中一个是以下代码:

I've come across some samples for a React DND and within one of them was the following code:

export type Author = {|
  id: string,
  name: string,
  avatarUrl: string,
  url: string,
|}

有几种这样的导出类型，在对象括号中带有双管道 {| ... |} ，尽管我进行了研究，但找不到任何能解释其作用的内容.我认为这是由于有多个Authors组合到了最终对象中(例如以下代码)，并且双管道防止了某些冲突.

There are several export types like this with the double pipe {|...|} in object brackets, and, despite my research, I can't find anything that explains what it does. I assume it's due to there being multiple Authors that are combined into the final object (re: the following code) and the double-pipes prevent some sort of conflict.

const princess: Author = {
  id: '4',
  name: 'Princess bubblegum',
  url: '',
  avatarUrl: '',
};

export const authors: Author[] = [
  jake, BMO, finn, princess,
];

推荐答案

这是流类型精确的对象类型注释.

This is a flowtype exact object type annotation.

https://flow.org/en/docs/types/objects/#toc-exact-object-types

有时禁用此行为并且仅允许一组特定的属性很有用.为此，Flow支持精确"对象类型.

Sometimes it is useful to disable this behavior and only allow a specific set of properties. For this, Flow supports "exact" object types.

基本上，它将不允许已定义道具以外的任何道具，如果您将... age:40 添加到 Author 对象，则应该抱怨.

Basically, it will not allow any props outside of the defined ones and should complain if you add, say... age: 40 to an Author object.

这篇关于React中对象中的双管道的目的是什么的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！