javascript - TypeScript: No index signature with a parameter of type 'string' when try to access the Enum - Stac

admin管理员组

文章数量:1313777

I'm getting this error when I try to access a value inside the Enum Localization with the variable locale that is a string.

enum Localization {
    'en-US' = '',
    'pt-BR' = '.br',
    'en-CA' = '.ca',
    'en-AU' = '.au',
    'en-IE' = '.ie',
    'string' = 'string'
};

 const locale:string = 'pt-BR' //This value will e from DB.
 const result = Localization[locale];

Error: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'typeof Localization'. No index signature with a parameter of type 'string' was found on type 'typeof Localization'.

In Javascript works normally.

     const Localization = {
       'en-US': '',
       'pt-BR': '.br',
       'en-CA': '.ca',
       'en-AU': '.au',
       'en-IE': '.ie',
     };
     
const locale = 'pt-BR';

console.log(Localization[locale]); // returns ".br"

I would like to know:

1 - How to convert the code Javascript to work in TypeScript?
2 - Why typescript is returning this error?
3 - If possible, I would like some reference links to read and understand why this error on TypeScript.
4 - What is the better approach to access data inside objects in TypeScript?

Thank you so much.

I'm getting this error when I try to access a value inside the Enum Localization with the variable locale that is a string.

enum Localization {
    'en-US' = '.',
    'pt-BR' = '..br',
    'en-CA' = '..ca',
    'en-AU' = '..au',
    'en-IE' = '..ie',
    'string' = 'string'
};

 const locale:string = 'pt-BR' //This value will e from DB.
 const result = Localization[locale];

Error: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'typeof Localization'. No index signature with a parameter of type 'string' was found on type 'typeof Localization'.

In Javascript works normally.

     const Localization = {
       'en-US': '.',
       'pt-BR': '..br',
       'en-CA': '..ca',
       'en-AU': '..au',
       'en-IE': '..ie',
     };
     
const locale = 'pt-BR';

console.log(Localization[locale]); // returns "..br"

I would like to know:

1 - How to convert the code Javascript to work in TypeScript?
2 - Why typescript is returning this error?
3 - If possible, I would like some reference links to read and understand why this error on TypeScript.
4 - What is the better approach to access data inside objects in TypeScript?

Thank you so much.

• javascript
• reactjs
• typescript

Share Improve this question Follow edited Sep 2, 2020 at 8:32 dveloso asked Sep 1, 2020 at 20:10 dvelosodveloso 10411 silver badge66 bronze badges 4

• 1 I ran your example on a few online ts editors, but they all ran okay. Can you share your config file? – yosefc Commented Sep 1, 2020 at 21:08
• It's working with typescript: stackblitz./edit/typescript-39eczb?file=index.ts – Prawin soni Commented Sep 1, 2020 at 21:08
• stackoverflow./questions/50417254/… – Abhirup Pal Commented Sep 1, 2020 at 21:13
• Hey guys, thank you so much for helping me, to get the error you need to add a type to the locale variable like const locale: string = 'pt-BR' I updated the example. Please try to run now. – dveloso Commented Sep 2, 2020 at 8:24

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 7

The below works at least with a map type, I see no reason why it wouldnt work with an explict enum type. const result = Localization[locale as keyof typeof Localization];

Source reddit

For something like this, I'd remend making a key type for ease of use and to ensure type checking continues to work down the chain.

enum Localization {
  'en-US' = '.',
  'pt-BR' = '..br',
  'en-CA' = '..ca',
  'en-AU' = '..au',
  'en-IE' = '..ie',
  'string' = 'string'
};

type LocalizationKey = keyof typeof Localization;
const locale:LocalizationKey = 'pt-BR' //This value will e from DB.
const result = Localization[locale];


// TYPECHECKING TEST:
function localization(r: Localization) {
  console.log(r)
}

localization(result);

// @ts-expect-error this line should error because it's not a key of Localization
localization('fail');

本文标签：