#No index signature with a parameter of type 'string' was found on type 'AssertsShape<{ accountName

1 messages · Page 1 of 1 (latest)

gritty onyx
#

I'm trying to use yup with typescript and react-hook-form, basically the ts compiler doesn't let me map over the forminputs which are inferred from yup schema. Here's is the code. Accessing data[key] shows the error.

const addAccountSchema = yup.object({
    accountName: yup.string().required("Name is required"),
    userName: yup.string().required("User name is required")
    ...
    ...
    file: yup.mixed().required("Image is required"),

  });  

type AddAccountInputs = yup.InferType<typeof addAccountSchema>;


 const onSubmit = handleSubmit(async (data) => {
   
    const formData = new FormData();
    
    Object.keys(data).forEach((key) => { 
      if (key === "file") {
        formData.append(key, data[key][0]);
      } else { 
        formData.append(key, data[key]);
      }
    });  ```
   
```ts
   {/ * 
 Element implicitly has an 'any' type because expression of type 'string' can't be used to index  type 'AssertsShape<{ accountName: RequiredStringSchema<string | undefined, AnyObject>; userName: RequiredStringSchema<string | undefined, AnyObject>; ... 6 more ...; insightImage: MixedSchema<...>; }>'.
  No index signature with a parameter of type 'string' was found on type 'AssertsShape<{ accountName: RequiredStringSchema<string | undefined, AnyObject>; userName: RequiredStringSchema<string | undefined, AnyObject>; ... 6 more ...; insightImage: MixedSchema<...>; }>'.ts(7053) 
 * /} ```
#

yes did that. Thankyou.

#

im trying but it doesnt seem to work

#

ok wait

gusty plover
#

In JavaScript, an object can have more properties than its types suggest.

gritty onyx
#

yes i've a hard time working with ts objects, i dont understand how it works. Is there anyway i can solve the above error?

gusty plover
# 
const manyFruits = { apple: 'red', banana: 'yellow', cherry: 'red' } as const
const someFruits = manyFruits as { 'apple': 'red', 'banana': 'yellow' }
const fruitNames = Object.keys(someFruits)
// actual contents of fruitNames: ['apple', 'banana', 'cherry']
// your expectations: ['apple', 'banana']
#

This is why TypeScript defines the type of fruitNames to be string[], because the compiler doesn't know if there are additional keys beyond those that the type system is aware of.

gritty onyx
#

So what's the workaround for this

gusty plover