mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-08-15 18:45:06 +00:00
SamandNicolas Gallagher
4fa6f77d25
When a Touchable component returns 0 for `touchableGetHighlightDelayMS()` the mixin may occasionally try to detect if the press event occurred on the hit area before the hit area has been determined. Clearing out this value ensures that `positionOnActivate` is recalculated before that takes place. Close #586
React Native for Web
React Native components and APIs for the Web.
Browser support: Chrome, Firefox, Safari >= 7, IE 10, Edge.
Overview
"React Native for Web" is a project to bring React Native's building blocks and touch handling to the Web.
Browse the UI Explorer to see React Native examples running on Web. Or remix the React Native for Web: Playground on Glitch.
Quick start
NOTE: React Native for Web supports React/ReactDOM 15.4, 15.5, or 15.6.
Install in your existing app using yarn or npm:
yarn add react@15.6 react-dom@15.6 react-native-web
Then read the Getting Started guide.
Documentation
The UI Explorer interactively documents all the APIs and Components.
Guides:
- Getting started
- Style
- Accessibility
- Direct manipulation
- Internationalization
- Advanced use
- Known issues
Starter kits
Example code
import React from 'react'
import { AppRegistry, Image, StyleSheet, Text, View } from 'react-native'
// Components
const Card = ({ children }) => <View style={styles.card}>{children}</View>
const Title = ({ children }) => <Text style={styles.title}>{children}</Text>
const Photo = ({ uri }) => <Image source={{ uri }} style={styles.image} />
const App = () => (
<Card>
<Title>App Card</Title>
<Photo uri="/some-photo.jpg" />
</Card>
)
// Styles
const styles = StyleSheet.create({
card: {
flexGrow: 1,
justifyContent: 'center'
},
title: {
fontSize: '1.25rem',
fontWeight: 'bold'
},
image: {
height: 40,
marginVertical: 10,
width: 40
}
})
// App registration and rendering
AppRegistry.registerComponent('MyApp', () => App)
AppRegistry.runApplication('MyApp', { rootTag: document.getElementById('react-root') })
Related projects
License
React Native for Web is BSD licensed.