Why do TypeScript tell me that a property doesn't exist on Button Component from NativeBase but-CodePudding

I'm using NativeBase on a React Native project and while everything works just fine when I run the app on my iPhone using Xcode, TypeScript tell me that the property "onPress" does not exist on the type of the NativeBase Button.

To simplify things here is my code :

import { Button } from 'native-base';

...

<Button
  variant="ghost"
  colorScheme="blueGray"
  onPress={() => {
  console.log('Ok')
  }}
>

And the error I get :

Type '{ children: string; onPress: () => void; }' is not assignable to type 'IntrinsicAttributes & IButtonProps & { ref?: MutableRefObject | undefined; }'. Property 'onPress' does not exist on type 'IntrinsicAttributes & IButtonProps & { ref?: MutableRefObject | undefined; }'.ts(2322)

Again, the code works just fine but it's annoying to get one error per button in each file of my project.

I'm not really used to React Native nor NativeBase so I can't find why it throws this error.

I tried to look a bit into the files to see if I could find the "onPress" property somewhere since it's working and it's on the documentation and I found out that according to TS :

import type { PressableProps } from 'react-native';

Module '"react-native"' has no exported member 'PressableProps'.ts(2305)

My question is why TS tell me that onPress doesn't exist but I figured it could help somehow since it looks like that's where onPress is supposed to be.

CodePudding user response：

typeScript is just a type checker which doesn't work in run time. Which means if you didn't put the right type into your component, all codes works fine cuz "typeScript only do his job in compile stage". So, if you wanna solve that error issue, please go to the typeScript document page and learn how to set types into your component. After that, when you set the right types(Function) in the Button component, all error message will disappear.

CodePudding user response：

After creating a fresh install, I figured out that for some reason - probably due to an update I did and the fact that I'm not using a lot of components for now - while React-Native was on version 0.64.X, the types were on version 0.62.X.

So the solution was to change the version of @types/react-native in package.json

TypeScript was unaware of the existence of the onPress property but it still existed so I had no problem on running the app. Since I updated the types to the correct version, it no longer tell me that the property doesn't exist.