justifyContent不起作用，我无法改变屏幕的背景颜色

Question

我使用原生基础，在这张图片中你会看到stackedLabel形式。我试图将其移动到屏幕的中心，但它不能使用justifyContent并仍然保持在屏幕的顶部。此外，我试图改变整个屏幕的背景颜色，这也是不起作用。 这是代码：

 <Container>

       <Content contentContainerStyle={{
        justifyContent:"center",
        flex:1,
        backgoroundColor: #00A577}}>

              <Form style={styles.form}>
        <Field name="email"
        component={this.renderInput}
               validate={[email, required]} />
        <Field
          name="password"
          component={this.renderInput}
          validate={[alphaNumeric, minLength8, maxLength15, required]}

        />
      </Form>
      <Button
full
        style={styles.button}
      onPress={() => this.signin()}
      >
        <Text style={{color:"#ffffff"}}>Sign In</Text>
</Button>



</Content>

          </Container>

如何解决这两个问题？

Answer 1

在contentContainerStyle

中将flex:1替换为flexGrow:1

代码

import React, { Component } from 'react';
import { Container, Header, Content, Form, Item, Input, Button, Text } from 'native-base';
export default class App extends Component {
  render() {
    return (
      <Container>
        <Content contentContainerStyle={{ justifyContent: "center", flexGrow: 1, backgroundColor: "#00A577" }}>
          <Form>
            <Input placeholder="e-mail" />
            <Input placeholder="password" />
          </Form>
          <Button full>
            <Text style={{ color: "#ffffff" }}>Sign In</Text>
          </Button>
        </Content>
      </Container >
    );
  }
}

Answer 2

您在“ backgoroundColor”上有错字。