react-native-orientation-listener 无法读取未定义的属性“getOrientation" [英] react-native-orientation-listener Cannot read property 'getOrientation' of undefined
本文介绍了react-native-orientation-listener 无法读取未定义的属性“getOrientation"的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
package.json
package.json
{
"name": "MakeItCluster",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "15.4.1",
"react-native": "0.39.2",
"react-native-orientation-listener": "0.0.4",
"react-native-vector-icons": "^3.0.0"
},
"devDependencies": {
"babel-jest": "18.0.0",
"babel-preset-react-native": "1.9.1",
"jest": "18.1.0",
"react-test-renderer": "15.4.1"
},
"jest": {
"preset": "react-native"
}
}
组件:
'use strict';
import React from 'react';
var Orientation = require('react-native-orientation-listener');
var Item = React.createClass({
componentWillMount: function() {
this._maintainDimensions();
},
render: function() {
// ...
},
_maintainDimensions: function() {
console.log(Orientation);
Orientation.getOrientation(function(err, orientation) {
// doing something here
}.bind(this));
}
});
module.exports = Item;
当我打印控制台方向"的值时,我看到:
When I print to console the value of "Orientation" I see:
{
addListener:addListener(callback)
getOrientation: getOrientation(callback)
removeListener: removeListener(listener)
__proto__: Object
}
但在下一行,当我调用 Orientation.getOrientation() 时,方向未定义!
But on the next line when I call Orientation.getOrientation(), Orientation is undefined!
推荐答案
我以不同的方式使用它并且它对我来说很好用,请检查下面的代码:
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);
这篇关于react-native-orientation-listener 无法读取未定义的属性“getOrientation"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文