Why is the new element not being added to the store?

Question

React

Created a simple CodeSandBox to show the problem - https://codesandbox.io/s/new-breeze-gf7st?file=/sr...

Trying to add a new comment with the add function which calls an action and throws an error you can see after clicking on the "leave a comment" button. In addition, in the action I am trying to pass the current value of the input through the parameter. I check it through console.log, and there, instead of value, the event onClick is displayed in general. This makes me think that I am doing everything wrong. Tell me, what are my mistakes and how to fix the code so that everything works correctly and comments are added?

Screenshot of the error and output to the console value

Answer 1

You hung up the add function on the button click. What do you expect to get in it as an input parameter?
The click event itself will come to the fieldText variable, as it should be. What made you think that there should be some text there?

Answer 2

The solution is to replace the variable name (fieldText) in the parameter of the add function with something else. Then the add function will take the fieldText variable from the App scope (just storing the value from the inputa), and not from the local one.