Android应用程序模拟器不断在React Native上停止

Question

I was editing one of the '.js' files and after saving my work after some changes, when I typed 'rr' to refresh application on the emulator, I kept getting this message.

Android Application Emulator keeps stopping App info Close app

enter image description here

After creating Form.js and under a components folder in my project in the visual studio code editor and importing it in my Login.js that's where the error started to occur. IDK what I did wrong. I'm new to React Native and am just learning.

Form.js

import React, {Component} from 'react';
import { 
    StyleSheet,  
    Text, 
    View,
    TextInput
  } from 'react-native';

export default class Login extends Component<{}> {
      render(){
          return(
              <View style={styles.container}>
                <TextInput style={styles.inputBox} 
                  underlineColorAndroid='rgba(0,0,0,0)' 
                  placeholder="Email"
                  placeholderTextColor = "#ffffff"
                   />
                <TextInput style={styles.inputBox} 
                  underlineColorAndroid='rgba(0,0,0,0)' 
                  placeholder="Password"
                  placeholderTextColor = "#ffffff"
                   />
                </View>
          )
      }
  }

const styles = StyleSheet.create({
container : {
  flex: 1,
  justifyContent: 'center',
  alignItems: 'center'
},
inputBox: {
  width:300,
  backgroundColor:'rgba(255,255,255,0.3)',
  borderRadius: 25,
  paddingHorizontal: 16,
  fontSize: 16,
  color:'#ffffff',
  marginVertical: '10'

}
});

Login.js

import React, {Component} from 'react';
import { 
    StyleSheet,  
    Text, 
    View,
    StatusBar
  } from 'react-native';

import Logo from '../components/Logo';
import Form from '../components/Form';

export default class Login extends Component<{}> {
render () {
return(
  <View style={styles.container}>
    <Logo/>  
    <Form/>      
  </View>
)
}
}

const styles = StyleSheet.create({
container : {
  backgroundColor: '#29b6f6',
  flex: 1,
  alignItems: 'center',
  justifyContent: 'center',
}
});

Answer 1

Here is your solution
Your application is crashed because of this props underlineColorAndroid="rgba(0,0,0,0)" in your TextInput and also minor change in inputBox style remove string value marginVertical: "10" to marginVertical: 10

Form.js

import React, { Component } from "react";
import { StyleSheet, Text, View, TextInput } from "react-native";

export default class Login extends Component {
  render() {
    return (
      <View style={styles.container}>
        <TextInput
          style={styles.inputBox}
          // underlineColorAndroid="rgba(0,0,0,0)"<---Comment this code---
          placeholder="Email"
          placeholderTextColor="#ffffff"
        />
        <TextInput
          style={styles.inputBox}
          // underlineColorAndroid="rgba(0,0,0,0)"<---Comment this code---
          placeholder="Password"
          placeholderTextColor="#ffffff"
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center"
  },
  inputBox: {
    width: 300,
    backgroundColor: "rgba(255,255,255,0.3)",
    borderRadius: 25,
    paddingHorizontal: 16,
    fontSize: 16,
    color: "#ffffff",
    marginVertical: 10 <-----Remove string to number---
  }
});

Output :--