Categories

See More
Popular Forum

MBA (4887) B.Tech (1769) Engineering (1486) Class 12 (1030) Study Abroad (1004) Computer Science and Engineering (988) Business Management Studies (865) BBA (846) Diploma (746) CAT (651) B.Com (648) B.Sc (643) JEE Mains (618) Mechanical Engineering (574) Exam (525) India (462) Career (452) All Time Q&A (439) Mass Communication (427) BCA (417) Science (384) Computers & IT (Non-Engg) (383) Medicine & Health Sciences (381) Hotel Management (373) Civil Engineering (353) MCA (349) Tuteehub Top Questions (348) Distance (340) Colleges in India (334)
See More

Can we use this.props.map as well as this.props.navigation in single class to navigate to another screen

General Tech Bugs & Fixes

Max. 2000 characters
Replies

usr_profile.png

User

( 6 months ago )

 

I have used this.props.maps as well as this.props.navigation which is showing an error:

this.props.navigation.navigate is undefined object

Trying to navigate to another page by rendering the firebase database but getting error but the same code i tried by simple creating a view and navigating to another page then it is working

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>
    );
  }
}

Need to navigate to another page

usr_profile.png

User

( 6 months ago )

 

Try this out

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>
    );
  }
}

what's your interest


forum_ban8_5d8c5fd7cf6f7.gif