Reputation: 191
While using multiple state variables in my App.jsx
I wanted to set the value of one state equal to that of another state.
const [exchangeRatio, setExchangeRatio] = useState();
const [toCurValue, setToCurValue] = useState();
function foo()
{
setToCurValue(exchangeRatio);
}
On console.log(exchangeRatio);
{exchangeRatio: undefined}
exchangeRatio: undefined
__proto__:
constructor: ƒ Object()
hasOwnProperty: ƒ hasOwnProperty()
isPrototypeOf: ƒ isPrototypeOf()
propertyIsEnumerable: ƒ propertyIsEnumerable()
toLocaleString: ƒ toLocaleString()
toString: ƒ toString()
valueOf: ƒ valueOf()
__defineGetter__: ƒ __defineGetter__()
__defineSetter__: ƒ __defineSetter__()
__lookupGetter__: ƒ __lookupGetter__()
__lookupSetter__: ƒ __lookupSetter__()
get __proto__: ƒ __proto__()
set __proto__: ƒ __proto__()
On further
console.log({exchangeRatio}.valueOf());
>>Undefined
I am new to React if there are ways to do the same feel free to write.
Upvotes: 1
Views: 1930
Reputation: 5786
const [exchangeRatio, setExchangeRatio] = useState();
const [toCurValue, setToCurValue] = useState();
The above statement denotes that you are declaring a state with values stored in exchangeRatio
and toCurValue
respectively and those states can be modified only using setExchangeRatio
and setToCurValue
methods respectively.
While you declare a state using useState()
, you are expected to specify the initial value of the state inside the useState()
as a parameter. For eg. if you want the initial value of exchangeRatio
to be 10, then you must write it as -
const [exchangeRatio, setExchangeRatio] = useState(10);
Now, since you haven't provided an initial state value, you are getting the console logged output as undefined. Once, you properly initialize it with the proper value, you can directly use the state and the stored value will be returned to you.
So, suppose you want to set toCurValue
's value to be equal to exchangeRatio
's value (which has been initialised properly), then you can either do it while writing useState() or using the setToCurValue
in following ways -
const [toCurValue, setToCurValue] = useState(exchangeRatio);
OR
setToCurValue(exchangeRatio);
Upvotes: 2