Question

这是我的index.android.js，导航到login.js后，显示错误。我怎样才能找到错误发生的位置？我运行eslint，但没有错误结果。

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 */
'use strict';

var React = require('react-native');
var {
  AppRegistry,
  Component,
  Navigator,
} = React;
var Login = require('./Login');

class WOMGrocery extends Component {
  constructor(props) {
    super(props);
    this.state = {isNavHidden: true};
  }

  render() {
    return (
      <React.Navigator
        // style={styles.container}
        initialRoute={{
          title: 'WOMGrocery',
          component: Login,
        }}
       navigationBarHidden={this.state.isNavHidden}
       />
    );
  }
}

AppRegistry.registerComponent('WOMGrocery', () => WOMGrocery);

我也附上了我的login.js。我不知道重新定义的颜色在哪里＆＃39;来自。

'use strict';

var React = require('react-native');
var Home = require('./Home');
var RegisterStep1 = require('./RegisterStep1');
var Config = require('./Config');
var Modal   = require('react-native-modalbox');

var {
  StyleSheet,
  View,
  PixelRatio,
  PushNotificationIOS,
  NavigatorIOS,
  AlertIOS,
  Navigator,
  Text,
  TextInput,
  Image,
  TouchableHighlight,
  Component
} = React;

var Button = React.createClass({
  render: function() {
    return (
      <TouchableHighlight
        underlayColor={'white'}
        style={styles.button}
        onPress={this.props.onPress}>
        <Text style={styles.buttonLabel}>
          {this.props.label}
        </Text>
      </TouchableHighlight>
    );
  }
});

class Login extends Component {
  constructor(props) {
    super(props);
    this.state = {
//      usernameString: '***@yahoo.com',
//      passwordString: '***',
      usernameString: '***@gmail.com',
      passwordString: '***',
//      usernameString: '***@gmail.com',
//      passwordString: '***',
//      usernameString: '',
//      passwordString: '',
      email_retrieve: '',
    };
  }

  componentWillMount() {
    PushNotificationIOS.addEventListener('notification', this._onNotification);
  }

  componentWillUnmount() {
    PushNotificationIOS.removeEventListener('notification', this._onNotification);
  }

  _sendNotification() {
    require('RCTDeviceEventEmitter').emit('remoteNotificationReceived', {
      aps: {
        alert: 'Sample notificationion',
        badge: '+1',
        sound: 'default',
        category: 'REACT_NATIVE'
      },
    });
  }

  _onNotification(notification) {
    AlertIOS.alert(
      'Notification Received',
      'Alert message: ' + notification.getMessage(),
      [{
        text: 'Dismiss',
        onPress: null,
      }]
    );
  }

  openModal1(id) {
    this.refs.modal1.open();
  }

  openModal2(id) {
    this.refs.modal2.open();
  }

  openModal3(id) {
    this.refs.modal3.open();
  }

  openModal4(id) {
    this.refs.modal4.open();
  }

  openModal5(id) {
    this.setState({isOpen: true});
  }

  openModal6(id) {
    this.refs.modal6.open();
  }

  openModal7(id) {
    this.refs.modal7.open();
  }

  closeModal3(id) {
    this.refs.modal3.close();
  }

  closeModal4(id) {
    this.refs.modal4.close();
  }

  closeModal5(id) {
    this.setState({isOpen: false});
  }

  closeModal6(id) {
    this.refs.modal6.close();
  }

  closeModal7(id) {
    this.refs.modal7.close();
  }

  ForgotPwd() {
    var fURL = Config.server + '/submitForgotPassword/' + this.state.email_retrieve + '/Grocery';
    fetch(fURL)
      .then((response) => response.json())
      .then((responseText) => {
        // console.log(responseText);
    this.closeModal3.bind(this);
      })
    .catch((error) => {
      console.warn("a:"+error);
      alert(error);
    });
  }

  Home() {
    this.props.navigator.push({
      title: 'Home',
      component: Home,
      passProps: {},
    });
    this.setState({ 
      isNavHidden: false
    });
  }

  RegisterStep1Page() {
    this.props.navigator.push({
      title: 'Results',
      component: RegisterStep1,
      passProps: {},
    });
  }

  onEmailRetrieveChanged(event) {
    this.setState({ email_retrieve: event.nativeEvent.text });
  }

  onUsernameTextChanged(event) {
    this.setState({ usernameString: event.nativeEvent.text });
  }

  onPasswordTextChanged(event) {
    this.setState({ passwordString: event.nativeEvent.text });
  }

  onHomePressed() {
    var uStr = this.state.usernameString;
    var pStr = this.state.passwordString;
    if (uStr.length>1) {
      if (pStr.length>1) {
        this._executeHome();
      } else {
    this.openModal7();
      }
    } else {
    this.openModal6();
    }
  }

  _handleHomeResponse(responseText, cCode) {
      this.props.navigator.push({
        title: 'Home',
        component: Home,
        passProps: {
      listings: responseText,
      cCode: cCode,
    }
      });
  }

  _executeHome() {
    var fURL = Config.server + '/login/' + this.state.usernameString + '/' + this.state.passwordString + '/Grocery';
    fetch(fURL)
      .then((response) => response.json())
      .then((responseText) => {
    if (responseText.myArrayList[0].myHashMap.StatusCode=="200") {
      var cCode = responseText.myArrayList[0].myHashMap.Code;
          var fURL2 = Config.server + '/getCustomerCart/' + cCode;
      fetch(fURL2)
      .then((response) => response.json())
          .then((responseText) => {
        var arr_length = +responseText.myArrayList.length - 1;
        this._handleHomeResponse(responseText.myArrayList[arr_length].myArrayList[0], cCode);
      })
          .catch((error) => {
            console.warn(error);
          });
    } else {
          this.openModal4();
      // alert("Incorrect username or password");
    }
    })
    .catch((error) => {
      console.warn("a:"+error);
      alert(error);
    });
  }

  render() {
    return (
      <View style={styles.container}>
        <View style={styles.imageContainer}>
          <Image source={require('image!fruit')} style={styles.fruit} />
        </View>
        <View style={styles.imageLogo2}>
      <Image resizeMode="contain" source={require('image!logo2')} style={styles.logo2} />
        </View>
        <View style={styles.imageLogo3}>
      <Image resizeMode="contain" source={require('image!logo3')} style={styles.logo3} />
        </View>
        <Button
          style={styles.btn2}
          onPress={this._sendNotification}
        />
        <Image resizeMode="contain" source={require('image!register_at2')} style={styles.register_at2} />
        <Image resizeMode="contain" source={require('image!register_pw2')} style={styles.register_pw2} />
        <TextInput style={styles.inputText_email} placeholder='  Email' placeholderTextColor='white' onChange={this.onUsernameTextChanged.bind(this)}/>
        <View style={styles.thinLine}></View>
        <View style={styles.thinLine2}></View>
    <TextInput style={styles.inputText_password} placeholder='  Password' placeholderTextColor='white' onChange={this.onPasswordTextChanged.bind(this)} secureTextEntry={true} />
        <Text style={styles.copyrightStyle}>
          Copyright (C) 2016 www.ocmeritmall.com
        </Text>
        <TouchableHighlight style={styles.buttonRegister} onPress={this.RegisterStep1Page.bind(this)} underlayColor='transprance'>
          <Text style={styles.buttonText2}>New here? Create an account ></Text>
        </TouchableHighlight>
        <TouchableHighlight style={styles.buttonLogin} onPress={this.onHomePressed.bind(this)}  underlayColor='transprance'>
          <Image resizeMode="contain" source={require('image!member_login')} style={styles.member_login} />
        </TouchableHighlight>
        <Text style={styles.instructions}>
          All rights reserved (version 1.2.19)
        </Text>
        <TouchableHighlight style={styles.buttonForgetPwd} underlayColor='transprance' onPress={this.openModal3.bind(this)}>
          <Text style={styles.buttonText}>Cannot access your account? ></Text>
        </TouchableHighlight>
    <Modal style={[styles.modal, styles.modal1]} ref={"modal1"} onClosed={this.onClose} onOpened={this.onOpen} onClosingState={this.onClosingState}>
          <Text style={styles.text}>You are not in the latest app version</Text>
          <Text style={styles.text2}>Press OK to download the latest app version</Text>
        </Modal>

    <Modal style={[styles.modal, styles.modal1]} ref={"modal2"} onClosed={this.onClose} onOpened={this.onOpen} onClosingState={this.onClosingState}>
          <Text style={styles.text}>Whoops! You Have No Internet</Text>
          <Text style={styles.text2}>Please check your network setting</Text>
        </Modal>

        <Modal style={[styles.modal, styles.modal1]} ref={"modal3"} onClosed={this.onClose} onOpened={this.onOpen} onClosingState={this.onClosingState}>
          <Text style={styles.text3}>Please Key In Your Registered Email</Text>
      <TextInput style={styles.inputText_email_retrieve} placeholder='  Registered Email Address' onChange={this.onEmailRetrieveChanged.bind(this)} />
      <TouchableHighlight style={styles.wrapperButtonOk} underlayColor='#FFAB0A' onPress={this.ForgotPwd.bind(this)}>
        <Image source={require('image!buttonOk')} style={styles.buttonOk} />
      </TouchableHighlight>
      <TouchableHighlight style={styles.wrapperButtonCancel} underlayColor='#FFAB0A' onPress={this.closeModal3.bind(this)}>
        <Image resizeMode="contain" source={require('image!buttonCancel')} style={styles.buttonCancel} />
      </TouchableHighlight>
        </Modal>

        <Modal style={[styles.modal, styles.modal1]} ref={"modal4"} onClosed={this.onClose} onOpened={this.onOpen} onClosingState={this.onClosingState}>
          <Text style={styles.text}>Incorrect username or password!</Text>
          <Text style={styles.text2}>No space bar allow in enter login</Text>
            <View style={styles.imagePassword}>
        <Image source={require('image!pop_password')} style={styles.pop_password} />
        </View>
      <TouchableHighlight style={styles.wrapperButtonOk} underlayColor='#FFAB0A' onPress={this.closeModal4.bind(this)}>
        <Image source={require('image!buttonOk')} style={styles.buttonOk} />
      </TouchableHighlight>
      <TouchableHighlight style={styles.wrapperButtonCancel} underlayColor='transprance' onPress={this.closeModal4.bind(this)}>
        <Image resizeMode="contain" source={require('image!buttonCancel')} style={styles.buttonCancel} />
      </TouchableHighlight>
        </Modal>

        <Modal isOpen={this.state.isOpen} onClosed={this.closeModal5} style={[styles.modal, styles.modal4]} position={"center"}>
          <Text style={styles.text}>Modal with backdrop content</Text>
        </Modal>

    <Modal style={[styles.modal, styles.modal1]} ref={"modal6"} onClosed={this.onClose} onOpened={this.onOpen} onClosingState={this.onClosingState}>
          <Text style={styles.text}>Login Email Cannot Be Empty!</Text>
          <Text style={styles.text2}>Please re-enter your login email</Text>
            <View style={styles.imageEpassword}>
        <Image source={require('image!pop_epassword')} style={styles.pop_epassword} />
        </View>
      <TouchableHighlight style={styles.wrapperButtonCancel} underlayColor='transprance' onPress={this.closeModal6.bind(this)}>
            <Image resizeMode="contain" source={require('image!buttonCancel')} style={styles.buttonCancel} />
          </TouchableHighlight>
      <TouchableHighlight style={styles.wrapperButtonOk} underlayColor='#FFAB0A' onPress={this.closeModal6.bind(this)}>
        <Image source={require('image!buttonOk')} style={styles.buttonOk} />
      </TouchableHighlight>
        </Modal>

    <Modal style={[styles.modal, styles.modal1]} ref={"modal7"} onClosed={this.onClose} onOpened={this.onOpen} onClosingState={this.onClosingState}>
          <Text style={styles.text}>Login Password Cannot Be Empty!</Text>
          <Text style={styles.text2}>Please re-enter your password</Text>
            <View style={styles.imageEpassword}>
        <Image source={require('image!pop_epassword')} style={styles.pop_epassword} />
        </View>
      <TouchableHighlight style={styles.wrapperButtonCancel} underlayColor='transprance' onPress={this.closeModal7.bind(this)}>
            <Image resizeMode="contain" source={require('image!buttonCancel')} style={styles.buttonCancel} />
          </TouchableHighlight>
      <TouchableHighlight style={styles.wrapperButtonOk} underlayColor='#FFAB0A' onPress={this.closeModal7.bind(this)}>
        <Image source={require('image!buttonOk')} style={styles.buttonOk} />
      </TouchableHighlight>
        </Modal>

      </View>
    );
  }
}

var styles = StyleSheet.create({
  thinLine: {.......

Answer 1

你的样式中是否有重复的color属性？

React-native：尝试重新定义属性＆＃39; color＆＃39;

1 个答案: