4 replies

No typescript error. Why?

Hey, all you tech geeks out there.
can someone explain to me why I didn't get ts error in this case?

here's a link to the file that confused me:
https://github.com/mbozhik/spiller/blob/main/src/components/app/products/Catalog.tsx

I have types defined for the entity “Product”.
https://github.com/mbozhik/spiller/blob/main/src/app/products/page.tsx

export interface Product {
  name: string
  caption: string
  article: number

  short_description: any
  full_description: any
...
}

export interface Product {
  name: string
  caption: string
  article: number

  short_description: any
  full_description: any
...
}

But for some reason I didn't get a typescript error when I tried to get “product.description” (which was deleted after creating this component). I should have gotten an error that I am trying to access a non-existent property of the “Product” interface

const Catalog: React.FC<{products: Product[]}> = ({products}) => {
 ...  
  const filteredProducts = products.filter((product) => {
    const productCaption = product.description.replace(/\s+/g, '').toLowerCase()
  })
...
}

const Catalog: React.FC<{products: Product[]}> = ({products}) => {
 ...  
  const filteredProducts = products.filter((product) => {
    const productCaption = product.description.replace(/\s+/g, '').toLowerCase()
  })
...
}

At the same time autocomplete types works, i.e. vs code when typing “product.” shows me the list of available values, but the error doesn't appear if I add something non-existent.

https://github.com/mbozhik/spiller/commit/0b4aff78273fc09a93249b4a93bc48854a2b53f3

I just changed the search operation from description to product signature, that way it will be more intuitive for the user. but this case doesn't leave me alone

Solution

Would it be fixed if you remove [x: string]: any?

Jump to solution

TTC

Theo's Typesafe Cult•2y ago•

4 replies

maks

No typescript error. Why?

export interface Product {
  name: string
  caption: string
  article: number

  short_description: any
  full_description: any
...
}

export interface Product {
  name: string
  caption: string
  article: number

  short_description: any
  full_description: any
...
}

const Catalog: React.FC<{products: Product[]}> = ({products}) => {
 ...  
  const filteredProducts = products.filter((product) => {
    const productCaption = product.description.replace(/\s+/g, '').toLowerCase()
  })
...
}

const Catalog: React.FC<{products: Product[]}> = ({products}) => {
 ...  
  const filteredProducts = products.filter((product) => {
    const productCaption = product.description.replace(/\s+/g, '').toLowerCase()
  })
...
}

Solution

Would it be fixed if you remove [x: string]: any?

Jump to solution

No typescript error. Why?

No typescript error. Why?

Similar Threads

Similar Threads

Similar Threads