Question

我有一个文件weatherProject.js：

        render() {
        return (
            <View style={styles.container}>
                <Text style={styles.welcome}>
                    You input {this.state.zip}.
                </Text>
                <Forecast
                    main={this.state.forecast.main}
                    description={this.state.forecast.description}
                    temp={this.state.forecast.temp}/>
                <TextInput
                   style={styles.input}
                   returnKeyType='go'
                   onSubmitEditing={this._handleTextChange} /> 
            </View>
        );
    }

});

var styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },

    welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10,
    },
    input: {
        fontSize: 20,
        borderWidth: 2,
        height: 40
    }
});

weatherProject需要预测模块var Forecast = require('./Forecast');：

var Forecast = React.createClass({
    render: function() {
        return (
            /*<View>
                <Text style={styles.bigText}>
                    {this.props.main}
                </Text>
                <Text style={styles.mainText}>
                    Current conditions: {this.props.description}
                </Text>
                <Text style={styles.bigText}>
                    {this.props.temp}°F
                </Text>
            </View>*/
            <View>
                <Text style={styles.bigText}>
                    {this.props.main}
                </Text>
                <Text>
                    Current conditions: {this.props.description}
                </Text>
                <Text>
                    {this.props.temp}°F
                </Text>
            </View>
        );
    }
});

var styles = StyleSheet.create({
bigText: {
    flex: 2,
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
    color: '#FFFFFF'
},
mainText: {
    flex: 1,
    fontSize: 16,
    textAlign: 'center',
    color: '#FFFFFF'
    }
})

module.exports = Forecast;

然而，在整合了预测模块之后，我没有＆＃39;在android虚拟手机上看到文本和输入。我的猜测是它＆＃39;来自样式和flexbox的代码编译很好，如果我删除flex：1语法它显示文本，为什么根据你现在的代码没有在屏幕上显示任何东西？（我的avd机器是Nexus 4型号）

感谢您的帮助

没有显示flex的样式字段

0 个答案: