Maximum call stack size exceeded [ERROR] [React-Redux]

I have error maximum call stack size exceeded. Maybe I in wrong way understand componentDidUpdate, but shouldn’t it’s run one time, instead 1000

class App extends Component {

  constructor(props) {
    super(props);
    this.state = {
      amount: 0
    }
  }

  updateAmout() {
    let number = 0;
    this.props.comments.map((comment, index) => {

      if (comment.replyTo === null) {

        number += 1;
        this.setState({amount: number});
      }
      return null;
    });
  }

  componentWillMount() {
    this.updateAmout();
  }

  componentDidUpdate() {
    this.updateAmout();
  }

  render() {
    console.log(this.state.amount);
    return (
      
<b>6 Comments</b> </div> <RenderComments /> </div> <button className="btn btn-block">More...</button> </div> </div> ) // return } // render } // App
Source: stackoverflow-javascript

Navigating to optional parameters with React Router

I am trying to make optional sub routes with my React Router but no matter what I search I can’t seem to find a solution that works for me !

I tried every solution mentioned in this answer:
React Router with optional path parameter
– nothing worked.

So I have the following in one file:

render(
  <Provider store={store}>
    <Router history={browserHistory} routes={routes} />
  </Provider> , document.getElementById('app')
  );

and then:

 export default (
   <Router history={browserHistory}>
     <Route path={'/'} component ={ApplicationHomePageContainer}></Route>
     <Route path={'/home'} component ={UserHomePageContainer}></Route>
     <Route path={'/circle(/:path)'} component ={CirclePageContainer}></Route>
    </Router>
 )

I have tried many many different approaches, but whatever I seem to do, the route /circle/whatever never renders anything.
All other work perfectly fine.

I am using React router version 2.8.3, I tried to upgrade to version 3 but that did not solve the issue.


Source: stackoverflow-javascript

How to trasnfer data from .map to function from href element with onClick

I’m trying to move one element from .map to onClick function so that I can pass it to redux but I’m not sure how to proced. This is my code

const Lists = lists.map((list, index) =>
    <li key={index}> {list.name} <a href="#" onClick={this.listInfo.bind(this)}>Learn More</a> </li> );

this is the function

listInfo(event){
 event.preventDefault();
 var el = list.name //this is where I want to save that value;
 console.log(el)
}

Thanks in advance


Source: stackoverflow-javascript