Hur konverterar man string-enum till enum i Reactjs TypeScript?


Jag har en enum som denna i en .ts-fil:

export enum TimeOfDay{
    MORNING = "AM",
    NOON = "12noon",
    EVENING = "PM",
    MIDNIGHT = "12midnight"
}

I en annan .tsx-fil har jag en sträng "12noon" i en variabel som heter selectedOption och jag vill konvertera den till denna enum. Hur kan jag göra det?

Jag försökte dessa baserat på de andra svaren på StackOverflow, men ingen av dem fungerade:

var timeInDay: TimeOfDay = TimeOfDay[selectedOption];

Ovanstående ger TS7053-fel.

var timeInDay: TimeOfDay = <TimeOfDay>selectedOption;

Ovanstående ger TS17008 och TS2604 fel.

var timeInDay: TimeOfDay = (<any>TimeOfDay)[selectedOption];

Ovanstående ger TS2339 och TS17008 fel.

Jag har gått igenom många svar på den här sidan men hittade ingen lösning.

Svar #1

Här är några sätt att använda en string där en strängenumtyp förväntas:

TS Lekplats

enum TimeOfDay{
  MORNING = "AM",
  NOON = "12noon",
  EVENING = "PM",
  MIDNIGHT = "12midnight"
}

function doSomethingWithTimeOfDay (time: TimeOfDay): void {
  console.log(time);
}

const selectedOption = '12noon';

// As you observed, this doesn't work:
doSomethingWithTimeOfDay(selectedOption);
//                       ~~~~~~~~~~~~~~
// Argument of type '"12noon"' is not assignable to parameter of type 'TimeOfDay'.

// Use a predicate to check at runtime:
function isTimeOfDay (value: string): value is TimeOfDay {
  return Object.values(TimeOfDay).includes(value as TimeOfDay);
}

if (isTimeOfDay(selectedOption)) {
  doSomethingWithTimeOfDay(selectedOption); // ok
}

// Or, if you're certain that the string is a valid string enum value,
// then you can use an assertion:
doSomethingWithTimeOfDay(selectedOption as TimeOfDay); // ok