Legends
Legends

Reputation: 22672

React-Redux - A component is changing a controlled input of type text to be uncontrolled

I have a little React-Redux demo app, which throws the below error, when I start entering a value in the textbox. The error occurs only the first time I start typing and does not happen anymore afterwards.

Screen view on first page load:

enter image description here

Here the repo that reproduces this error. The repo contains only one component so it's easy to find. I didn't post the code here, because it is too much for posting it.

I use React-Redux (actions/reducers/store) for my application.

I have read a lot of posts regarding this error and all say that the initial value of the input control/textbox may not be null or undefined, which is not the case here.

The initial store state is set to:

const combinedReducers = combineReducers({
    CountReducer
});

const initialStoreState = {
    CountReducer: {count: 123, wish_value: 12}
};

let store = createStore(combinedReducers, initialStoreState);

export default store;

enter image description here

Upvotes: 0

Views: 289

Answers (1)

mYsZa
mYsZa

Reputation: 505

case "update":
   const val = Number(wish_value);

   if (isNaN(val)) {
      return { 
          count: "No number"
      };
   }

   return {
      count: Number(val)
   };

Shouldn't you be updating wish_value here as well?

Upvotes: 1

Related Questions