使用Flow

Question

我有以下内容：

// @flow

import React from 'react';

type IconMap = {
  [name: string]: {}
};

export const icons: IconMap = {
  circle: {
    viewbox: '0 0 473.66 473.66',
    path(props) {
      return (
        <g id="Layer_2" data-name="Layer 2" {...props}>
          <g id="Layer_1-2" data-name="Layer 1">
            <circle cx="236.83" cy="236.83" r="236.83" />
          </g>
        </g>
      );
    }
  }
};

首先，如何让上面的IconMap类型不接受未密封的对象作为值，而是{ viewbox: string, path: function }呢？

其次，如果我试图按如下方式呼叫icons：

const obj = icons['circle']

如果circle 不 icons的某个键，我怎样才能确保上述内容在编译时失败？

Answer 1

关于第一个问题，你可以这样做：

type IconMap = {
  [name: string]: {|
    viewbox: string,
    path: Object => React$Node
  |}
};

对于你的第二个问题，据我所知，在编译时不可能这样做。

React$Node定义为here，默认情况下附带Flow。或者你也可以

import type {Node} from 'react