无法分配给只读属性&#39; navigator&#39;对象&#39;#<dedicatedworkerglobalscope>&#39;

时间:2016-11-14 07:13:01

标签: reactjs react-native react-router

我遇到错误无法分配给只读属性&#39;导航器&#39;当我的应用程序处于调试模式时,对象&#39;#&#39; 。 我完成了整个代码,但无法找出原因在哪里陷入困境,我也没有得到它的解决方案。我的父类实现是

class MainPage extends Component {
  render() {
    return (
      <Navigator ref={(nav) => { navigator = nav; }}
          initialRoute={{id: 'SplashPage', name: 'SplashPage'}}
          renderScene={this.renderScene.bind(this)}
          configureScene={(route) => {
            if (route.sceneConfig) {
              return route.sceneConfig;
            }
            return Navigator.SceneConfigs.FloatFromRight;
      }} />
    );
  }

  renderScene(route, navigator) {
    var routeId = route.id;

    if (routeId === 'SplashPage') {
      return (
        <SplashPage
          navigator={navigator} {...route.passProps} />
      );
    }


    if (routeId === 'Login') {
      return (
        <Login
          navigator={navigator} {...route.passProps} />
      );
    }

    return this.noRoute(navigator);
  }

  noRoute(navigator) {
    return (
      <View style={{flex: 1, alignItems: 'stretch', justifyContent: 'center'}}>
          <Text style={{color: 'red', fontWeight: 'bold'}}>Please check you Navigation Logic</Text>
      </View>
    );
  }
};

module.exports = MainPage;

我的子类实现是,

class Login extends Component {

  constructor(props) {
    super(props);
    this.state = { username: '',password:'' };
  }

  render() {
    return (
      <Navigator ref={(nav) => { navigator = nav; }}
          renderScene={this.renderScene.bind(this)}
          navigator={this.props.navigator}
          navigationBar={
            <Navigator.NavigationBar style={styles.container}
                routeMapper={NavigationBarRouteMapper} />
          } />
    );
  }
  validateLogin() {

    if(!Validators.validateOnlyText(this.state.username)) {
      alert('User ID cannot be blank');
      return;
    }

    if(!Validators.validateOnlyText(this.state.password)) {
      alert('Password cannot be blank');
      return;
    }

    var webServiceName=WebserviceHelper.Constants.POST_AUTHENTICATION;
    var valuesJson= { "UserId" : this.state.username,  "Password" : this.state.password };
    WebserviceHelper.postValues(webServiceName, valuesJson, this);
  }

  postWebCallback(webResponse){
    navigator.parentNavigator.replace({
      id: 'Home',
      passProps: {
            'userId': this.state.username,
            'userNo' : this.state.webResponse.userNo

    });
module.exports = Login;

1 个答案:

答案 0 :(得分:1)

我也遇到了这个问题。编译器不喜欢的是这个

ref={(nav) => { navigator = nav; }}
导航器标签上的

我已将navigator字词更改为thisNavigator,并使用var声明将其声明在范围之外,从而解决了问题。