Radio group doesn't read correct state

[baselshlewett]

Description

Radio.Group onChange event doesn't have correct values of previous state, instead is has the initial state of the variable we're using. So deconstructing an object will result an override of the latest state of the variable

CodeSandbox/Snack link

https://snack.expo.dev/dQWI2wSVm

Steps to reproduce

1. create multiple FormControl in one screen
2. Create a Radio.Group inside FormControl
3. const [data, setData] = useState({});
4. update other Input's values like shown in docs
5. update Radio.Group value like shown in docs
6. Notice that the state of data variable has reset to initial value and upon updating it only has RadioGroup value

NativeBase Version

3.3.x

Platform

• [X] Android
• [ ] CRA
• [ ] Expo
• [X] iOS
• [ ] Next

Other Platform

No response

Additional Information

Happens on 3.4.x

[baselshlewett]

@rayan1810 Thanks for maintaining the library :)

Any updates on this issue and if there's any expectation to when it should be solved?

*asking for sprint planning purposes

[Viraj-10]

Hi @baselshlewett, Thanks for reporting this issue. we are looking into it. For now you can try this work around. radio work around.

[Youngtao1999]

@baselshlewett I noticed this issue has not been fixed, if you need, you can try to set the Radio.Group component a key prop, the value is use updated state, let Radio.Group rerender. hope it helps you

[danielfigueroaj]

@baselshlewett I noticed this issue has not been fixed, if you need, you can try to set the Radio.Group component a key prop, the value is use updated state, let Radio.Group rerender. hope it helps you

Still waiting for a fix.. meanwhile, you mean adding a key to the radio.group component like this?

<Radio.Group name="myRadioGroup" key="somerandomkey" ....>

Thanks in advanced

[Youngtao1999]

@baselshlewett I noticed this issue has not been fixed, if you need, you can try to set the Radio.Group component a key prop, the value is use updated state, let Radio.Group rerender. hope it helps you

Still waiting for a fix.. meanwhile, you mean adding a key to the radio.group component like this?

<Radio.Group name="myRadioGroup" key="somerandomkey" ....>

Thanks in advanced

Yes, this key need to be changed by the value you choose. Let the Radio component force update by update the key.

It is only a temporary way, if you want to solve the issue, maybe you need wait for the author to fix it, or implement the Radio component yourself according to your actual situation.

Hope it helps you

[heyalexchoi]

Passing key did not work for me. I needed latest value of state to be captured in onChange handler. I added a ref to capture that value and then read it in the onChange handler so even though the updated handler isn't passed in correctly, it is reading that latest value captured in the ref.

[holmesjr]

Seriously, the workaround Viraj posted is probably the best approach. Using the function for of the setter provides the correct previous state.