How do I define the types of values in an object without having to use array notation to access values?

Question

I have defined this type:

type RouteMap = { [k: string]: React.Route };

Which I am trying to apply like this:

const routes: RouteMap = {
  setDomain: { title: 'Set Domain', component: SetDomain }
};

export default class MyClass extends React.Component<void, void> {
  render() {
    return (
      <View style={styles.container}>
        <NavigatorIOS initialRoute={routes.setDomain} />
      </View>
    );
  }
}

But that is yielding this error:

Property 'setDomain' does not exist on type RouteMap.

This works if I try to access the property like so: routes['setDomain'] but i'd like to avoid that. Is there any way to let TypeScript still infer the keys from the assignment?

artem · Accepted Answer · 2017-01-05 20:55:38Z

1

It's kind of doable with mapped types, but typescript will not infer the type in routes initializer without the help of intermediate function:

type RouteMap<K extends string> = {[T in K]: React.Route}

// dummy function necessary to infer generic type parameter from the value
function routeMap<K extends string>(r: RouteMap<K>): RouteMap<K> { return r }

const routes = routeMap({
  setDomain: { title: 'Set Domain', component: SetDomain }
});

Without routeMap() function you have to specify key type yourself, which also works but looks ugly:

const routes2: RouteMap<'setDomain'> = {
  setDomain: { title: 'Set Domain', component: SetDomain }
};

edited Jan 5, 2017 at 20:55

answered Jan 5, 2017 at 20:20

artem

52.2k10 gold badges86 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How do I define the types of values in an object without having to use array notation to access values?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related