React-Native ios App在我的手机上崩溃了

时间:2017-11-24 16:53:40

标签: ios react-native

我最近开始开发React Native应用程序......

现在我正在构建一个iOS应用程序...当我使用iOS模拟器测试应用程序时,每件事情都可以,当我将iPhone连接到笔记本电脑并直接在我的iPhone上构建和运行应用程序时我不会# 39;有任何问题,我的应用程序工作...但当我从笔记本电脑分离我的iPhone时,应用程序崩溃,我无法再次运行...

我不知道什么是问题...

这是我的代码:

import React, {Component} from "react";
import {Image, Text, View} from "react-native";
import Proximity from "react-native-proximity";
import {Card, CardSection} from "./common";


let rekatCounter = 0;
let sajdeCounter = 0;

class Main extends Component {

constructor(props) {
    super(props);
    this.state = {
        proximity: false,
        sajdeCounter: 0
    };
    this._proximityListener = this._proximityListener.bind(this);
}

componentDidMount() {
    Proximity.addListener(this._proximityListener);
}

/**
 * State of proximity sensor
 * @param {object} data
 */
_proximityListener(data) {
    if (data.proximity) {
        sajdeCounter += 1;
        this.setState({
            proximity: data.proximity,
        });
    }
}

componentWillUpdate() {

    if (sajdeCounter % 2 === 1 && sajdeCounter !== 1) {
        sajdeCounter = 1;
        rekatCounter += 1;
    }

    if (sajdeCounter === 1 && rekatCounter == 0) {
        rekatCounter = 1;
    }

    if (rekatCounter === 5 && sajdeCounter % 2 === 1) {
        sajdeCounter = 0;
        rekatCounter = 0;
    }

}

componentWillUnmount() {
    Proximity.removeListener(this._proximityListener);
}

render() {
    const resizeMode = 'cover';
    return (
        <Card>
            <CardSection>
                <View style={styles.sajdeCounterWrapper}>
                    <View
                        style={{
                            position: 'absolute',
                            top: 0,
                            left: 0,
                            width: '100%',
                            height: '100%',
                            justifyContent: 'center',
                            alignItems: 'center'
                        }}
                    >
                        <Image
                            style={{
                                flex: 1,
                                resizeMode,
                            }}
                            source={ require('../../assets/bg.jpg')}
                        />
                    </View>

                    <Text style={styles.sajdeCounter}> {sajdeCounter}</Text>
                </View>
                <View style={styles.sajdeLabelWrapper}>
                    <Text style={styles.sajdeLabel}>Some string</Text>
                </View>
            </CardSection>
            <CardSection>
                <View style={styles.rekatCounterWrapper}>
                    <View
                        style={{
                            position: 'absolute',
                            top: 0,
                            left: 0,
                            width: '100%',
                            height: '100%',
                            justifyContent: 'center',
                            alignItems: 'center'
                        }}
                    >
                        <Image
                            style={{
                                flex: 1,
                                resizeMode,
                            }}
                            source={ require('../../assets/bg.jpg')}
                        />
                    </View>

                    <Text style={styles.rekatCounter}>{rekatCounter}</Text>
                </View>
                <View style={styles.rekatLabelWrapper}>
                    <Text style={styles.rekatLabel}>Some string</Text>
                </View>
            </CardSection>

        </Card>
    );
}

}

const styles = {
    sajdeCounterWrapper: {
        flex: 3,
        justifyContent: 'center',
        alignItems: 'center'
    },
    sajdeCounter: {
        fontSize: 45
    },
    sajdeLabelWrapper: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center'
    },
    sajdeLabel: {
        fontSize: 45
    },
    rekatCounterWrapper: {
        flex: 3,
        justifyContent: 'center',
        alignItems: 'center'
    },
    rekatCounter: {
        fontSize: 45
    },
    rekatLabelWrapper: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center'
    },
    rekatLabel: {
        fontSize: 45
    }
};

export default Main;

1 个答案:

答案 0 :(得分:1)

您的应用崩溃的原因是因为它需要连接到笔记本电脑。

要在手机上运行您的应用,而无需通过电缆将其连接到电脑,您需要将手机连接到笔记本电脑所连接的相同wifi。