State Changes But Not Reflected In Dom

Still a React newbie, I'm working on a basic election collation App that sums up results from various states among the two main political parties then determines who had the higher

Solution 1:

Ok, so I took a look at your Github repo and you have two main problems:

First, You are calling the function "handleSubmit" at AddStateResuts, but you are not passing the required "e" argument for it to work.

If you take a look at your dev tools console there must be a warning about it.

That you can fix as bellow ath the line 8 of the component AddStateResuts:

    <form onSubmit={e =>this.props.handleSubmit(e)}>

Second, even if it now shows the APC and PDP values it will not show the State name.

That's because you named it "nameofstate" at "AddStateResuts", while it's named as "name" at "DataSource" and "App". What I did to make it work was to change all the instances of "name" regarding the state name to "nameofstate" at the "Datasource", "DisplayStateResult" and "App" components as it is more specific and it now works like a charm.

Good coding, I'm also kind of new to React and it can be kind of confusing at the start, I suggest you to always keep an eye at the normal dev tools console, not only the React tools.