React Native - the problem of passing parenthood to a child

Question

a React newbie having some problems passing states and functions from the parent component ( App in this case) and access from child components ( Main in this case). I'm sure these are one or two really simple mistakes, where did I work?

Here is the project structure:

 App |__ Rootstack | |__Favorites |__Main 

And here is the stripped-down code:

 class Main extends React.Component { render() { return ( <View> <Text>{this.props.favoritesList.length}</Text> <Card> onSwiped={() => {this.props.updateArray}} //the idea being that on a swipe, updateArray would add 1 to the 'favoriteList' in the parents state, and the favoritesList.length would update by +1. </Card> </View> ); } } class Favorites extends React.Component { .... } const RootStack = StackNavigator( { Main: { screen: Main}, Favorites: { screen: Favorites} }, { initialRouteName: 'Main' } ); export default class App extends Component<{}> { constructor(props) { super(props); this.state = { favoritesList: [] }; this.updateArr = this.updateArr.bind(this); //don't know if this is necessary? } updateArr=()=>{this.setState({ favoritesList: [...this.state.favoritesList, 'new value']})}; render() { return <RootStack {...this.state} updateArray={this.updateArr}/>; } } 

The error I get is - any idea? Thanks in advance!

Answer 1

1 -

This is not true

  <Card ... props should be here!!--- > onSwiped={() => {this.props.updateArray}} //the idea being that on a swipe, updateArray would add 1 to the 'favoriteList' in the parents state, and the favoritesList.length would update by +1. </Card> 

Correct answer:

  <Card onSwiped={() => {this.props.updateArray}} //the idea being that on a swipe, updateArray would add 1 to the 'favoriteList' in the parents state, and the favoritesList.length would update by +1. > </Card> 

The meaning of the error is that the child of the map is expected as an object, not .....

2 -

this.updateArr = this.updateArr.bind(this); not required since updateArr = () => ... written to es6