typescript - Får undefined-parameter när jag använder importerad const

Jag har denna konstant som jag exporterar till fil och sedan skickar jag ett värde från den till en funktion

export const STANDARD_COLORS: { [key: string]: number} = {
  notifyBlue: 0x1a72b5,
  deleteRed: 0xde3f51,
  newGreen: 0x12a571,
  updateOrange:0xffa74e
}

som detta

.setColor(STANDARD_COLORS.newGreen)

men jag får

Argument of type 'number | undefined' is not assignable to parameter of type 'ColorResolvable | null'.

Type 'undefined' is not assignable to type 'ColorResolvable | null'

När jag försöker skicka det med ! på det här sättet

STANDARD_COLORS.newGreen!

felet är borta men jag har en känsla av att det är en lat lösning på det verkliga problemet

Svar #1

Detta fel uppstår endast med noUncheckedIndexedAccess, vilket implicit lägger till undefined till dina indexsignaturer. Att inaktivera detta får felet att försvinna, men du kanske inte vill göra det om du vill ha denna extra nivå av strikthet.

Om du anger en typannotering på en variabel försöker TypeScript inte att titta på tilldelningen för variabelns typ, så det har inget sätt att veta med säkerhet att newGreen inte är undefined

Om STANDARD_COLORS är statisk (dvs nycklarna är kända) och du bara använder typannoteringen för att säkerställa att värdena i objektet är siffror, kan du använda satisfies-operatorn istället:

export const STANDARD_COLORS = {
  notifyBlue: 0x1a72b5,
  deleteRed: 0xde3f51,
  newGreen: 0x12a571,
  updateOrange:0xffa74e
  red :"red" // error
} satisfies  { [key: string]: number };

setColor(STANDARD_COLORS.newGreen)

Lekplatslänk

Om du använder en version som inte har satisfy kan du också använda en funktion för att upprätthålla begränsningen:

function makeColorTable<T extends Record<keyof T,number>>(c: T) {
  return c;
}
export const STANDARD_COLORS = makeColorTable({
  notifyBlue: 0x1a72b5,
  deleteRed: 0xde3f51,
  newGreen: 0x12a571,
  updateOrange:0xffa74e
  red :"red" // error
})

setColor(STANDARD_COLORS.newGreen)

Lekplatslänk