Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

How to correctly add the onHoverIn TS type for the React Native Web Pressable component?

$
0
0

I'm using React Native Web in combination with Typescript and I would like to use the React Native Web Pressablecomponent from the lib.

However, I faced a problem when the VSCode blames the React Native Web prop types like: onHoverIn. The main issue in this situation is that the React Native prop types definition doesn't contain the enhanced props from RNWeb

Could someone, please, give to me a tip on how it could be solved in the right way?
I wouldn't like to disable TS checking in every file where I'd like to use Pressable

Here is the Error message:

type '{ children: Element; accessibilityRole: "button"; delayLongPress: number; disabled: false; onHoverIn: () => void; onHoverOut: () => void; onKeyDown: () => void; onLongPress: () => void; onPress: () => void; onPressIn: () => void; onPressOut: () => void; }' is not assignable to type 'IntrinsicAttributes & PressableProps & RefAttributes<View>'.   Property 'onHoverIn' does not exist on type'IntrinsicAttributes & PressableProps & RefAttributes<View>'.ts(2322)

The code example:

import React from 'react';import {  Text, Button, ScrollView, StyleSheet, View, Pressable } from 'react-native';....<Pressable    accessibilityRole="button"    delayLongPress={750}    disabled={false}    onHoverIn={() => {      console.log('onHoverIn');    }}    onHoverOut={() => {      console.log('onHoverOut');    }}    onKeyDown={() => {      console.log('onKeyDown');    }}    onLongPress={() => {      console.log('onLongPress - 750ms delay');    }}    onPress={() => {      console.log('onPress');    }}    onPressIn={() => {      console.log('onPressIn');    }}    onPressOut={() => {      console.log('onPressOut');    }}><Text>Pressable</Text></Pressable>

Thanks for any help!


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>