ReactJS: “this.props” is not a function when child component calls parent

Question

I have written this code and am currently wrangling with a bug in an onClick event. I have two events, the onClick event on the child element and the onChange event on the top-l

Answer 1

The problem is caused by map function, you should pass in this for thisArg when calling map:

this.props.accounts.map(function(each_account) {
  rows.push(
    <AccountRow 
      account = {each_account.name} 
      key = {each_account.name}
      {...this.props}     
    />);
 }, this);

However, this will cause AccountRow to have redundant variables like accounts and activeAccount. I think you should consider transfer only the onChange function:

 <AccountRow 
     account = {each_account.name} 
     key = {each_account.name}
     onChange = {this.props.onChange}
 />