score:1
Accepted answer
fontsize?: 'xs' | 'sm' | 'md' | 'lg';
one of the possible values here is undefined
, due to the ?
which makes it optional. but undefined
can't be the key of an object, so when you try to make a record with these as the keys, typescript complains.
you can exclude undefined
by using nonnullable:
export const fontsize: record<nonnullable<iconprops['fontsize']>, string> = {
xs: '14px',
sm: '16px',
md: '18px',
lg: '24px',
};
or if you prefer, exclude is another option:
export const fontsize: record<exclude<iconprops['fontsize'], undefined>, string> = {
xs: '14px',
sm: '16px',
md: '18px',
lg: '24px',
};
score:1
iconprops['fontsize']
is optional. it means the value could be undefined
. however, undefined
could not be a key of the object
. you can use required
to exclude the undefined
situation of iconprops
.
export const fontsize: record<required<iconprops>['fontsize'], string> = {
xs: '14px',
sm: '16px',
md: '18px',
lg: '24px',
};
Source: stackoverflow.com
Related Query
- Typescript error Type 'string | undefined' does not satisfy the constraint 'string | number | symbol'
- How to fix the error argument of type string or undefined is not assignable to parameter of type string using typescript and react?
- TypeScript: Type 'T' does not satisfy the constraint '(...args: any) => any'
- Type 'State' does not satisfy the constraint '(state: any, ...args: any[]) => any'
- Typescript i18next does not satisfy the constraint 'string | TemplateStringsArray NextJS
- TypeScript: Type 'ActionTypes' does not satisfy the constraint 'Action<any>'
- How to fix error argument of type undefined is not assignable to parameter of type 'string or () => string usng typescript and react?
- What does the error "JSX element type '...' does not have any construct or call signatures" mean?
- error TS2602: JSX element implicitly has type 'any' because the global type 'JSX.Element' does not exist
- TypeScript error after upgrading version 4 useParams () from react-router-dom Property 'sumParams' does not exist on type '{}'
- Typescript error "Property does not exist on type 'JSX.IntrinsicElements'" when using native web component
- Why am I getting the error message "Property 'then' does not exist on type 'AsyncThunkAction'"?
- Transpiling error in Typescript with React: Property does not exist on type 'IntrinsicAttributes'
- Styled-jsx typescript error after migrating to monorepo structure. Property 'jsx' does not exist on type 'DetailedHTMLProps'
- React Custom Hook with Typescript Type error "Property 'x' does not exist on type 'interface | (({ target }: any) => void)'.ts(2339)"
- Property does not exist on type error with Union Types in Typescript Reac + Redux
- how to resolve typescript error ts2339: property 'yyy' does not exist on type 'intrinsicattributes & ...?
- How do I fix a React TypeScript error with the return value of useHotkeys hook not matching the type of the div element ref prop
- How to solve the error 'Warning: React.createElement: type should not be null, undefined in React?
- Property 'rawValue' does not exist on type 'EventTarget & HTMLInputElement' error while using typescript with cleave.js
- Typescript error in ReactJS - Property does not exist on type
- Typescript error "children does not exists on type IntrinsicAttributes & RefAttributes<unknown>'.* " on react component
- resolving error message Error: The schema does not contain the path: spinach. (failed at: undefined which is a type: "object")
- Next.JS - Error when Checking if window == undefined : Hydration failed because the initial UI does not match what was rendered on the server
- How to fix typescript error 'name' does not exist in type 'ByRoleOptions' when querying by accessible name using getByRole in react-testing-library
- Typescript error says property does not exist on type
- How to fix the error type Item[] | undefined is not assignable to Item[] type using react and typescript?
- Typescript extending generic component type doesn't satisfy the constraint
- Type does not satisfy the constraint. Index signature is missing in type
- React event target value from jsx element does not get bind to state and json array (Type error cannot read the properties of undefined )
More Query from same tag
- How to add the element id in reactjs
- TestCafé + React JSX error (unexpected Token)
- What is the most elegant approch to waiting until a loop ends and than do an operation in Javascript?
- React Native: Refs in ListView
- React Redux doesnt dispatch action
- Trying to pass onChange function as props to GrandChlidren result into TypeError: this is undefined
- Unable to pass props to child component in react
- Converting Responsive Grid Layout to Plotly Dash
- How to push to state in React Hooks?
- Why the Update state doesn't work- Reactjs
- How to render seperated JSONs in react that are correlated
- 'npm start' Taking way too long
- Parameter count mismatch - due to babel polyfill
- How correctly write Jest test for avoid act() warning?
- How to dynamically extend the interface or type of an object in TypeScript?
- What happened with the render() after React Hooks?
- Redux dispatch function and TypeScript
- Bind icon images to their respective names then render
- Importing a component library using react in Storybook
- How can i do Inset FAB using Material UI in React?
- Describe method can only pass with 1 test unless re-rendering each component again and again
- How to import and reference multiple custom fonts locally using Next.JS?
- ReactJS: I can not get the state to update with API data when the asynchronous API data fetch is completed
- Successfully Submitted alert on React
- React Custom Hooks fetch data globally and share across components?
- Delete element from array in redux state using a reducer in createSlice
- How to properly combine these two useEffects
- Access Electron Api from React
- Wait Until Data is Fetched from MongoDB React JS
- React: Passing data between components using Router in App.js(parent component)