Question

我正在尝试在我的本机应用程序中显示/隐藏组件。我正在使用的代码的缩减版本受到Hide/Show components in react native的启发。代码如下：

'use strict';
var React = require('react-native');
var {
  Text,
  Navigator,
} = React;


class SomePage extends Component {

  constructor(props) {
    super(props);
    this.state = {
      showView : true,
    };
  }

  render() {
    return (
      <Navigator
          renderScene={this.renderScene.bind(this)}
      />
    );
  }

  testRender()
  {
    return (
      <Text>ShowView: {this.showView}</Text>
        )
  }

  renderScene(route, navigator) {
    if (this.state.showView){
      return ({this.testRender.bind(this)})
    }
    else
    {
      return (<Text>ShowView: {this.showView}</Text>)
    }
  }
}

遗憾的是，代码无效，并且在

上引发了“意外的令牌错误”

return ({this.testRender.bind(this)})

如果我将该行写为

return (this.testRender.bind(this))

错误消失但我得到一个空白屏幕。关于我在这里做错了什么的想法？

Answer 1

bind在这里不是正确的方法。你需要调用这个函数。

  renderScene(route, navigator) {
    if (this.state.showView){
      return this.testRender();
    }
    else
    {
      return (<Text>ShowView: {this.showView}</Text>)
    }
  }

显示/隐藏具有react-native状态更改的组件时出错

1 个答案: