Question

我正在尝试使用StyleSheet来清理我的样式，但我似乎无法让它工作。我相信当我尝试创建样式表（const styles = EStyleSheet.create时）会导致错误（如下所示） 注意我正在使用react-native-extended-stylesheet 但是这不是问题所在。这也发生在react-native的样式表中。这是错误的图片：

这是我的代码：

import React, { Component } from "react";

import {
  View,
  Text,
  Button,
  Image,
  StyleSheet,
  TextInput,
  KeyboardAvoidingView,
  TouchableOpacity
} from "react-native";

export default class Login extends Component {
  render() {
    return (
      <View style={styles.wrapper}>
        <Text>Login screen </Text>

        <KeyboardAvoidingView behavior="padding" style={styles.loginContainer}>

          <TextInput
          placeholder="username or email"
          placeholderTextColor='whitesmoke'
          style={styles.input}
          />

          <TextInput
          placeholder="password"
          secureTextEntry
          placeholderTextColor='whitesmoke'
          style={styles.input}
          />

          <TouchableOpacity style={styles.loginbutton} onPress={() => this.props.navigation.navigate("Grades")}>
            <Text style={{
              textAlign: 'center',
              color: "whitesmoke",
              fontWeight: '700',
            }}>
            Login
            </Text>
          </TouchableOpacity>

        </KeyboardAvoidingView>

      </View>
    );
  }
}

const styles = StyleSheet.create({
  loginContainer: {
    paddingHorizontal: 9,
    backgroundColor: "red"
  },

  input: {
      paddingHorizontal: 10,
      marginBottom: 10,
      color: '#f1c40f', //sunflower color
      backgroundColor: '#3498db',
    },

 logo: {
    width: 231,
    height: 231
  },

  wrapper: {
    flex: 1,
    alignItems: "center",
    justifyContent: "center" 
  }

});

这是我的app.js。

import React from "react";
import { Font } from "expo";

import { Root } from "./app/router";
import { FontError } from "./app/components/fontError";

export default class App extends React.Component {
  state = {
    fontLoaded: false
  };
  async componentDidMount() {
    await Font.loadAsync({
      Arial: require("./app/resources/Arial.ttf")
    });
    this.setState({ fontLoaded: true });
  }
  render() {
    if (!this.state.fontLoaded) return <FontError/>;
    return <Root />;
  }
  // ...
}

我的根组件是router.js，我正在使用react-navigation。

import React, { Component } from "react";
import { createStackNavigator } from "react-navigation";

import {
  Login,
  Grades,
} from "./screens";

export const Root = createStackNavigator({
  Login: {screen: Login},
  Grades: {screen: Grades},

});

请随时要求我附加任何其他信息感谢您的帮助。

Answer 1

为了解决我的错误，我只是重新克隆了回购并添加了我写的所有代码谢天谢地，我没有把这个错误推到主分支这修复了错误。

*注意在这个过程中我摆脱了react-native-extended-stylesheet，所以它可能是错误原因。

不变违规：元素类型无效

1 个答案: