如果/ React Native中的/ else语句

Question

我在React Native中遇到if / else语句有问题。

例如，我有两种状态：

onOpen() {
  this.setState({
    index: 1
  });
}

onClose() {
  this.setState({
    index: 0
  });
}

我需要设置状态索引：0，当切换关闭时，索引：1，切换打开时。

<TouchableOpacity onPress={() => 
  {index === 0 
    ? navigator.toggleDrawer(this.onClose()) 
    : navigator.toggleDrawer(this.onOpen())
  }
}>

现在，当我点击菜单按钮时，我每次都会收到索引0，但是它们应该在1和之后改变。感谢。

组件：

import React from 'react';
import {
  TouchableOpacity,
  Image 
} from 'react-native';

export default class Home extends Component {
  constructor(props) {
    super(props);
    this.state = {
      index: 0
    };
  }
  onOpen() {
    this.setState({
      index: 1
    });
  }

  onClose() {
    this.setState({
      index: 0
    });
  }

  render() {
    const { index } = this.state;
    return (
   <TouchableOpacity onPress={() => {index === 1 ? 
     navigator.toggleDrawer(this.onClose()) : 
     navigator.toggleDrawer(this.onOpen())}}>
        <Image
        source={require('something.png')}
       />    
   </TouchableOpacity>
    );
  }
}

Answer 1

export default class Home extends Component {
  constructor(props) {
    super(props);
    this.state = { index: 0 };
    this.toggleIndex = this.toggleIndex.bind(this);
  }

  toggleIndex() {
    navigator.toggleDrawer();
    this.setState({ index: this.state.index === 0 ? 1 : 0 });
  }

  render() {
    return (
      <TouchableOpacity onPress={toggleIndex}>
        <Image
          source={require('something.png')}
        />
      </TouchableOpacity>
    );
  }
}

Answer 2

问题可能是当你关闭抽屉时，你不是真的按下菜单按钮，而是暗覆盖，因此你的onPress功能不会被调用。在抽屉打开/关闭时尝试查找是否有任何事件，并在该事件中设置状态。