我们可以使用javascript。道具。地图和这个一样好。道具。在单个类中导航以导航到另一个屏幕

Question

我使用了this.props.maps和this.props.navigation，这显示了一个错误：

this.props.navigation.navigate is undefined object

试图通过呈现firebase数据库导航到另一个页面，但出现错误，但与我尝试的代码相同，只需创建一个视图并导航到另一个页面，即可正常工作

export default class ItemComponent extends Component {


  constructor(props) {
    super(props);
    // need to bind `this` to access props in handler
    this._onEditLibrary = this._onEditLibrary.bind(this);
  }

  static propTypes = {
      items: PropTypes.array.isRequired
  };
  _onEditLibrary=()=> {
    this.props.navigation.navigate('EditLibrary');
  };
  render() {
    return (
      <View style={styles.itemsList}>
          <TouchableOpacity  onPress={this._onEditLibrary}>
        {this.props.items.map((item, index) => {
            return (
                <View key={index}>

                <ImageBackground source={item.Image} style={ { height:150, width:150}}>
                    <Text style={styles.itemtext}>{item.Name}</Text>
                    </ImageBackground>

                </View>
            )
        })
        }
        </TouchableOpacity>
      </View>
    );
  }
}

需要导航到其他页面

Answer 1

试试这个

export default class ItemComponent extends Component {


  constructor(props) {
    super(props);
    // need to bind `this` to access props in handler
    this._onEditLibrary = this._onEditLibrary.bind(this);
  }

  static propTypes = {
      items: PropTypes.array.isRequired
  };
  _onEditLibrary=()=> {
    this.props.navigation.navigate('EditLibrary');
  };
  render() {
    return (
      <View style={styles.itemsList}>
        {this.props.items.map((item, index) => {
            return (
                <TouchableOpacity key={index} onPress={this._onEditLibrary}>
                    <ImageBackground source={item.Image} style={ { height:150, width:150}}>
                           <Text style={styles.itemtext}>{item.Name}</Text>
                    </ImageBackground>
              </TouchableOpacity>
            )
        })
        }
      </View>
    );
  }
}