How to use updateIsActiveIndex

[t-castanho]

I tried with a ref. But every time i want to load the value i'm getting that this.ref.radioform.updateIsActiveIndex is not an object and the value isn't updated

[guosim]

Try following the example under Callback Refs. It worked for me. https://reactjs.org/docs/refs-and-the-dom.html

[BolajiOlajide]

This is an example

const Settings = () => {
  const radioButtonRef = useRef(null);
  const [settings, updateSettings] = useAsyncStorage(USER_SETTINGS);

useEffect(() => {
    if (settings) {
      const monitorOptionIdx = TRACKING_CHOICES.indexOf(settings.trackingOption);
      radioButtonRef.current.updateIsActiveIndex(monitorOptionIdx);
      setMonitoringOption(monitorOptionIdx);
      setThreshold(settings.threshold.toString());
      setUserCoinsToTrack(settings.coinsToTrack);
    }
  }, [settings]);

  return (
   <View style={styles.optionBlock}>
          <Text style={styles.settingsText}>
            How would you like to monitor prices?
          </Text>
          <RadioForm
            initial={monitoringOption}
            ref={radioButtonRef}
            radio_props={monitoringOptions}
            onPress={(value) => setMonitoringOption(value)}
            buttonColor={colors.BLACK}
            labelColor={colors.BLACK}
          />
        </View>
  );
}

[victorwvieira]

This is an example

const Settings = () => {
  const radioButtonRef = useRef(null);
  const [settings, updateSettings] = useAsyncStorage(USER_SETTINGS);

useEffect(() => {
    if (settings) {
      const monitorOptionIdx = TRACKING_CHOICES.indexOf(settings.trackingOption);
      radioButtonRef.current.updateIsActiveIndex(monitorOptionIdx);
      setMonitoringOption(monitorOptionIdx);
      setThreshold(settings.threshold.toString());
      setUserCoinsToTrack(settings.coinsToTrack);
    }
  }, [settings]);

  return (
   <View style={styles.optionBlock}>
          <Text style={styles.settingsText}>
            How would you like to monitor prices?
          </Text>
          <RadioForm
            initial={monitoringOption}
            ref={radioButtonRef}
            radio_props={monitoringOptions}
            onPress={(value) => setMonitoringOption(value)}
            buttonColor={colors.BLACK}
            labelColor={colors.BLACK}
          />
        </View>
  );
}

This example worked perfectly for me. Tks!

[carmiaca]

I looked all over the web for how to change the initial value of a radio button with an asynchronous form update from the local device saved information.
radioButtonRef.current.updateIsActiveIndex(myindex) did not work for me. So I gleaned what I needed from the code and am using instead the react-native-simple-radio-button function is_active_index found in index.js:

constructor(props) { super( props ); this.radioButtonRef = React.createRef(); }

make a function to loop through the button props and when a you find a match for the value you want to select: changeInitialValue = ( newbuttonvalue, buttonRef, buttonProps ) => { if( newbuttonvalue != null ) { for( var key in buttonProps ) { if( buttonProps[key].value == newbuttonvalue ) { //won't work without parseInt - views key as string instead of number buttonRef.current.setState({ is_active_index: parseInt( key ) }); } } } }

Refer to the function in your asynchronous get to set the new value in a .then(( this.changeInitialValue( returnArray.mybuttonnewvalue, this.radioButtonRef, this.button_props );

in the form...I'm using Formik... if using Formik, you must use...enableReinitialize <Formik enableReinitialize={true} ...... <RadioForm ref={this.radioButtonRef} value={values.program} radio_props={this.button_props} initial={-1} ....