Edit: it seems that if I comment out the line "this.setState({logged_in: true});", line 63, that I don't get the error. My guess is that something about the way I'm trying to change the content being displayed in the render function based on if the user is logged in or not is what is the cause of this error. Any ideas?
编辑:如果我注释掉这条线的话。设置状态({ logged_in:真});第63行,我没有得到误差。我的猜测是,我试图改变呈现函数中显示的内容的方式是基于用户是否登录的,这就是导致这个错误的原因。什么好主意吗?
I've been making some slight progress in understanding some very basics of React Native, I feel like. Although my code might not be pretty, up until some recent additions it worked. I'm recieving an error message in the IOS Simulator that reads "Invalid data message - all must be length: 8". It unfortunately isn't giving me any specifics that I understand, such as linenumbers.
我在理解一些基本的反应方面已经取得了一些进展,我觉得。虽然我的代码可能并不漂亮,但直到最近添加了一些代码之后,它才开始工作。我在IOS模拟器中收到一条错误消息,上面写着“无效的数据消息——所有的长度必须是:8”。不幸的是,它没有提供我所理解的任何细节,比如linenumbers。
I sincerely apologise if this is a repost, I've been looking like crazy on google and * to find a solution to this error but have been unsuccessful in my searches.
我真诚地道歉,如果这是转发,我一直疯狂地在谷歌和*上寻找这个错误的解决方案,但在我的搜索中失败了。
I've censored the url I've using in fetch since it is an adress for testing within the company in very early stages, but I am 99,99% sure that's not where the problem lies.
我已经审查了我在fetch中使用的url,因为它是公司早期测试的一个入口,但我99,99%肯定这不是问题所在。
My index.ios.js:
我的index.ios.js:
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Button,
Alert,
TextInput,
TouchableHighlight,
Image,
AlertIOS,
PickerIOS,
} from 'react-native';
var REASONS = {
sick: {
name: "sjuk"
},
vacation: {
name: "semester"
},
child_care: {
name: "vård av barn"
},
parenting: {
name: "föräldraledig"
},
general: {
name: "övrigt"
},
};
export default class mbab_franvaro extends Component {
constructor(props) {
super(props);
this.state = {username: '', password: '', logged_in: false, reason: 'sjuk'};
}
logout(){
this.setState({logged_in: false});
this.username = ""; this.password = "";
}
login(){
if(this.state.username == "" || this.state.password == ""){
AlertIOS.alert("Fel", "Vänligen fyll i alla fält.");
}
else{
fetch("MY_PRIVATAE_COMPANY_URL", {
method: "POST",
headers: {
'Accept': 'application/x-www-form-urlencoded',
'Content-Type': 'application/x-www-form-urlencoded',
},
body: "username=" + this.state.username + "&password=" + this.state.password,
})
.then((response) => response.json())
.then((response) => {
if(JSON.stringify(response.body).replace(new RegExp('"', 'g'), '').match("Inloggad")){
this.username = this.state.username; this.password = this.state.password;
this.setState({logged_in: true});
//AlertIOS.alert("Hej!", "Välkommen " + this.username + "!");
}
else{
AlertIOS.alert(
"Fel",
JSON.stringify(response.body).replace(new RegExp('"', 'g'), '')
);
}
})
.catch((error) => {
AlertIOS.alert("error", error);
})
.done();
}
}
render(){
if(this.state.logged_in){
//sidan för frånvarorapportering
return (
<View style={styles.container}>
/*<TouchableHighlight style={styles.logout_button} onPress={() => this.logout()}>
<Text style={styles.login_button_text}>Logga ut</Text>
</TouchableHighlight>*/
<View style={styles.report_wrapper}>
<Text style={styles.header}>Frånvarorapportering</Text>
<Text>Ange anledning och hur stor del av dagen du blir frånvarande.</Text>
<PickerIOS
selectedValue={this.state.reason}
onValueChange={(reason) => this.setState({reason})}>
{Object.keys(REASONS).map((reason) => (
<PickerItemIOS
key={reason}
value={reason}
label={REASONS[reason].name}
/>
))}
</PickerIOS>
</View>
</View>
);
}
else{
//inloggningssidan
return (
<View style={styles.container}>
<Image resizeMode="center" style={styles.logo} source={require('./app/res/logo_cmyk.png')} />
<TextInput
placeholder="Namn"
autocorrect={false}
style={styles.text_box}
onChangeText={(username) => this.setState({username})}
/>
<TextInput
placeholder="Lösenord"
autocorrect={false}
secureTextEntry={true}
style={styles.text_box}
onChangeText={(password) => {this.setState({password})}}
/>
<TouchableHighlight style={styles.login_button} onPress={() => this.login()}>
<Text style={styles.login_button_text}>Logga in</Text>
</TouchableHighlight>
</View>
);
}
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F4F4F4',
},
report_wrapper: {
flex: 1,
},
logout_button: {
flex: 0,
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
marginLeft: 10,
marginRight: 10,
marginTop: 30,
marginBottom: 2,
padding: 10,
backgroundColor: "#003878"
},
login_button: {
flex: 0,
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
marginLeft: 10,
marginRight: 10,
marginTop: 2,
marginBottom: 2,
padding: 10,
backgroundColor: "#003878"
},
login_button_text: {
color: "white",
fontSize: 20,
flex: 1,
textAlign: "center",
},
logo: {
//flex: 1,
},
text_box: {
height: 40,
flex: 0,
backgroundColor: "white",
marginLeft: 10,
marginRight: 10,
marginTop: 2,
marginBottom: 2,
padding: 10
},
header: {
color: "#84754E",
fontSize: 25,
marginTop: 30,
},
});
AppRegistry.registerComponent('mbab_franvaro', () => mbab_franvaro);
编辑:
2 个解决方案
#1
0
Add toString()
to error
did the trick for me:
添加toString() to error对我来说是一个诀窍:
.catch((error) => {
AlertIOS.alert("error", error.toString());
})
#2
0
I was also getting the same error while using ScrollView.
Took me 2 days to figure out the solution.
I wasn't importing ScrollView from react-native.
Check if you've imported the Picker or not. :)
我在使用ScrollView时也得到了相同的错误。我花了两天时间才想出解决办法。我没有从反应堆本地导入ScrollView。检查您是否导入了选择器。:)
#1
0
Add toString()
to error
did the trick for me:
添加toString() to error对我来说是一个诀窍:
.catch((error) => {
AlertIOS.alert("error", error.toString());
})
#2
0
I was also getting the same error while using ScrollView.
Took me 2 days to figure out the solution.
I wasn't importing ScrollView from react-native.
Check if you've imported the Picker or not. :)
我在使用ScrollView时也得到了相同的错误。我花了两天时间才想出解决办法。我没有从反应堆本地导入ScrollView。检查您是否导入了选择器。:)