javascript - 开发服务器返回错误代码:500(React Native)
问题描述
你好,我对本机反应很新我正在处理这个项目它是我正在处理的项目的登录/注册页面在此处输入图像描述 运行通过博览会,在物理设备上运行它。我已经尝试过堆栈溢出时可用的其他选项,但至少没有一个对我有用
***App.js***
import React from 'react'
import{StyleSheet,Text,View}from 'react-native'
import RegForm from './app/Components/RegForm'
export default class App extends React.Component{
render(){
return(
<View style={Styles.Container}>
<RegForm />
</View>
)
}
}
const styles=StyleSheet.Create({
container:{
flex:1 ,
justifyContent:'center',
backgroundColor:'#36485f' ,
paddingLeft:60 ,
paddingRight:60 ,
},
})
***RegForm***
import React from 'react'
import{StyleSheet,Text,View,TextInput,TouchableOpacity}from 'react-native'
export default class RegForm extends React.Component{
render(){
return(
<View style={Styles.RegForm}>
<Text style={styles.header}>Registration</Text>
<TextInput style={styles.TextInput} placeholder="Please Enter your Name" />
<TextInput style={styles.TextInput} placeholder="Please Enter your Email" />
<TextInput style={styles.TextInput} placeholder="Please Enter your Password"
secureTextEntry={true} />
<TextInput style={styles.TextInput} placeholder="Please Enter your Mobile No" />
<TextInput style={styles.TextInput} placeholder="Please Enter your CNIC" />
<TouchableOpacity style={styles.button}>
<Text style={styles.btntext}>Sign Up</Text>
</TouchableOpacity>
</View>
)
}
}
const styles=StyleSheet.Create({
RegForm:{
alignSelf:'strech' ,
},
header:{
fontSize:24 ,
color:'#fff',
paddingBottom:10 ,
marginBottom:40 ,
borderBottomColor:'#199187',
borderBottomWidth:'1',
},
TextInput:{
alignSelf:'strech',
height:40 ,
marginBottom:30 ,
color:'#fff' ,
borderBottomColor:'#f8f8f8',
borderBottomWidth:1 ,
},
button:{
alignSelf:'strech',
alignItem:'center',
padding:20 ,
backgroundColor:'#59cbbd',
marginTop:30 ,
},
btntext:{
color:'#fff',
fontWeight:'bold',
}
})
解决方案
请检查你的代码
***App.js***
import React from 'react'
import{StyleSheet,Text,View}from 'react-native'
import RegForm from './app/Components/RegForm'
export default class App extends React.Component{
render(){
return(
<View style={styles.Container}>
<RegForm />
</View>
)
}
}
const styles=StyleSheet.Create({
container:{
flex:1 ,
justifyContent:'center',
backgroundColor:'#36485f' ,
paddingLeft:60 ,
paddingRight:60 ,
},
})
您正在使用“样式”而不是“样式”
<View style={Styles.RegForm}>
尝试删除 node_modules 和 package-lock.js 并清除 npm 缓存和 expo 缓存并再次启动应用程序,
npm 缓存清理 --force
世博会开始--清除
推荐阅读
- javascript - React:是否可以在组件收到新道具之前停止代码“阅读”?
- android - 如何使用launchActivity将测试从单个测试套件中的捆绑包中恢复活动的测试与其他测试保持一致
- azure-media-services - Azure 媒体服务 V3:编码的音频文件无法在 Azure 媒体播放器中播放
- .net - Unity 脚本从 .net 3.5 到 .net 4.0 静默失败
- javascript - 如何检查文本覆盖的图像百分比?
- module - 如何将 OpenMPI 添加到代码块?
- amazon-web-services - Classic 和 Application EC2 负载均衡器之间的 HTTPS 到 HTTP 差异
- python-3.x - 我们可以使用 cx_Oracle 在 python3 中实现查询 dbms_stats.gather_table_stats 吗?如果是,那怎么办?
- spring-boot - 需要在 Spring Boot 中动态生成 url 以进行招摇
- javascript - 如何确定 jquery ajax 调用何时完成?