Skip to content Skip to sidebar Skip to footer

React-native-orientation-listener Cannot Read Property 'getorientation' Of Undefined

package.json { 'name': 'MakeItCluster', 'version': '0.0.1', 'private': true, 'scripts': { 'start': 'node node_modules/react-native/local-cli/cli.js start', 'test':

Solution 1:

I am using it in different ways and its working fine for me, please check code below:

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  AppRegistry
} from 'react-native';
var Orientation = require('react-native-orientation-listener');
var or="j";
export default class Googleplay extends Component {
  constructor(props){
    super(props);
    this.state = { or: ''};
  }
  _maintainDimensions() {
        console.log(Orientation);
        Orientation.getOrientation(function(err, orientation) {
          console.warn(err);
            console.warn(orientation);
        }.bind(this));
    }
    componentWillMount() {
        this._maintainDimensions();
    }

  _setOrientation(data) {

    //console.warn(data.orientation+' "'+data.device+'"');
    this.setState({ or: data.orientation});
  }
  componentDidMount(){
    Orientation.getOrientation(
    (orientation, device) => {
      console.warn(orientation, device);
      this.setState({ or: orientation});
    }
    );
    Orientation.addListener(this._setOrientation.bind(this));
  }
  render() {
    if(this.state.or == "PORTRAIT"){
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          PORTRAIT
        </Text>
        <Text style={styles.instructions}>
          To get started, edit index.android.js
        </Text>
        <Text style={styles.instructions}>
          Double tap R on your keyboard to reload,{'\n'}
          Shake or press menu button for dev menu
        </Text>
      </View>
    );
    }else{
      return (
        <View style={styles.container}>
          <Text style={styles.welcome}>
            LANDSCAPE
          </Text>
          <Text style={styles.instructions}>
            To get started, edit index.android.js
          </Text>
          <Text style={styles.instructions}>
            Double tap R on your keyboard to reload,{'\n'}
            Shake or press menu button for dev menu
          </Text>
        </View>
      );
    }
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

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

Post a Comment for "React-native-orientation-listener Cannot Read Property 'getorientation' Of Undefined"