KeykoYume KeykoYume - 4 months ago 18
iOS Question

Can't find variable: React

I just started learning react so I apologise in advance if this may sound like a stupid question.
I'm trying to make a simple iOS page with a button that triggers an action.
I have followed the tutorial on how to get started and this is my index code:

'use strict';
var React = require('react-native');
var {
AppRegistry,
StyleSheet,
Text,
View,
TouchableHighlight,
Component,
AlertIOS // Thanks Kent!
} = React;

class myProj extends Component {
render() {
return (
<View style={styles.container}>
<Text>
Welcome to React Native!
</Text>
<TouchableHighlight style={styles.button}
onPress={this.showAlert}>
<Text style={styles.buttonText}>Go</Text>
</TouchableHighlight>
</View>
);
}

showAlert() {
AlertIOS.alert('Awesome Alert', 'This is my first React Native alert.', [{text: 'Thanks'}] )
}
}

var styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#FFFFFF'
},
buttonText: {
fontSize: 18,
color: 'white',
alignSelf: 'center'
},
button: {
height: 44,
flexDirection: 'row',
backgroundColor: '#48BBEC',
alignSelf: 'stretch',
justifyContent: 'center'
}
});

AppRegistry.registerComponent('myProj', () => myProj);


The problem is that when I run it from Xcode on my device I get

Can't find variable: React
render
main.jsbundle:1509:6
mountComponent
mountChildren


I tried to search online for the answer but couldn't find anything that actually help. Any idea what might be the problem here?

Answer

In the latest version of React Native you must import React from 'react' package

import React, {Component} from 'react';
import {
View,
...
} from 'react-native';
Comments