使用Flow验证对象图

Question

I have the following:

 // @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> ); } } }; 

First, how can I make the type IconMap above not accept an unsealed object as a value, but { viewbox: string, path: function } instead?

Second, if I'm trying to call icons as follows:

const obj = icons['circle']

How can I make sure the above fails at compile-time if circle is not one of the keys of icons ?

Answer 1

For your first question you can do:

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

For your second question, it's not possible to do that at compile time as far as I know.

React$Node is defined here , and ships with Flow by default. Alternatively you could

import type {Node} from 'react