android - 异步 React Native 的按钮无响应问题

Question

我从 github 项目复制了以下代码并尝试使用 expo。该项目执行时没有错误，但当我按下按钮时没有任何反应。甚至没有错误，这是我的代码注意-我在 onChooseImagePress 内设置了一个警报，并且警报工作正常

import React from 'react';
import { Image, StyleSheet, Button, Text, View, Alert, } from 'react-native';
import { ImagePicker } from 'expo';
import * as firebase from 'firebase';
import {firebaseConfig} from "./ApiKeys";

export default class HomeScreen extends React.Component {
    static navigationOptions = {
        header: null,
    };

    onChooseImagePress = async () => {
        let result = await ImagePicker.launchCameraAsync();
        //let result = await ImagePicker.launchImageLibraryAsync();

        if (!result.cancelled) {
            this.uploadImage(result.uri, "test-image")
            .then(() => {
                Alert.alert("Success");
            })
            .catch((error) => {
                Alert.alert(error);
            });
        }
    }

    uploadImage = async (uri, imageName) => {
        const response = await fetch(uri);
        const blob = await response.blob();

        var ref = firebase.storage().ref().child("images/" + imageName);
        return ref.put(blob);
    }

    render() {
        return (
            <View style={styles.container}>
            <Button title="Choose image..." onPress={this.onChooseImagePress} />
            </View>
            );
        }
    }

    const styles = StyleSheet.create({
        container: { flex: 1, paddingTop: 50, alignItems: "center", },
    });
}

Answer 1

代码中存在多个语法问题:

1. const styles... 应该在渲染函数内部定义，目前它在类之外悬空
2. 括号不匹配

        return (
            <View style={styles.container}>
            <Button title="Choose image..." onPress={this.onChooseImagePress} />
            </View>
            );
        }
    } // the class ends here


Please let me know if it still doesn't work