Search code examples
cssreact-nativeexporeact-native-webmetro-bundler

Is there an equivalent of :hover in react-native-web?

I'm trying to make a react-native app using expo, since expo and metro bundler are compatible with react-native-web, I get my web view and Android/IOS with almost the same code. How can I do something like the equivalent of css :hover in there? Since there's no css and styles are done in Javascript objects like this and later converted to html css elements? Is there a built-in functionality for this or do I need to use a library?

const styles = StyleSheet.create({

  element: {
    backgroundColor: "#fff",
    margin: 20,
  }
})
Solution

  • react-native-web supports hover based events in a Pressable via the onHoverIn and onHoverOut props. You can find an example in their docs: https://necolas.github.io/react-native-web/docs/pressable/