Fehler: "Ungültige Datenmeldung - alle müssen Länge: 8 sein" - PickerIOS

Question

Edit: es scheint, dass, wenn ich die Zeile "this.setState ({angemeldet in: true});", Zeile 63, das auskommentieren Ich bekomme den Fehler nicht. Meine Vermutung ist, dass etwas über die Art, wie ich versuche, den Inhalt zu ändern, der in der Renderfunktion angezeigt wird, basierend darauf, ob der Benutzer angemeldet ist oder nicht, was die Ursache dieses Fehlers ist. Irgendwelche Ideen?

Ich habe ein paar leichte Fortschritte in das Verständnis einiger Grundlagen von React Native gemacht, ich fühle mich wie. Obwohl mein Code möglicherweise nicht hübsch ist, funktionierte er bis zu einigen kürzlichen Ergänzungen. Ich erhalte eine Fehlermeldung im IOS Simulator mit der Meldung "Ungültige Datennachricht - alle müssen Länge: 8". Es gibt mir leider keine Einzelheiten, die ich verstehe, wie zum Beispiel Leinennummern.

Ich entschuldige mich aufrichtig, wenn dies ein Repost ist, habe ich wie verrückt auf Google und stackoverflow gesucht, um eine Lösung für diesen Fehler zu finden, aber bei meinen Suchen nicht erfolgreich gewesen.

Ich habe die URL zensiert, die ich in fetch verwende, da es eine Adresse für das Testen innerhalb der Firma in sehr frühen Stadien ist, aber ich bin 99,99% sicher, dass dort nicht das Problem liegt. Mein 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); 

Edit:

Answer 1

hinzufügen toString()-error den Trick für mich getan hat:

.catch((error) => { 
    AlertIOS.alert("error", error.toString()); 
}) 

Answer 2

ich auch war immer die gleiche Fehler bei der Verwendung von ScrollView.
Ich brauchte 2 Tage um die Lösung herauszufinden.
Ich habe ScrollView nicht von reaktiv-nativ importiert.
Überprüfen Sie, ob Sie den Picker importiert haben oder nicht. :)