Not clearing with reack hook form reset()

[sephirothtbm]

Someone knows how to solve the next issue?

I'm combining the dropdowns with react-hook-form with the next code:

<Controller control={control} defaultValue={undefined} name='brand_id' rules={{ required: { value: true, message: 'Campo obligatorio' }, }} render={({ field: { onChange, onBlur, value, ...field } }) => ( <> <DropDown label='Marca*' mode={'outlined'} visible={showBrandDD} value={value} setValue={(_val) => { setValue('brand_id', _val); setSelectedBrand(_val); }} showDropDown={() => setShowBrandDD(true)} onDismiss={() => setShowBrandDD(false)} dropDownItemStyle={styles.dropDownItem} inputProps={{ style: styles.dropDown, placeholderTextColor: colors.placeholder, outlineStyle: styles.outlineStyle, right: <TextInput.Icon icon={menu-down} color={colors.disabledText} /> }} list={brands} /> <HelperText type={'error'}>{errors.brand_id?.message} </> )} />

Everything is working fine, but if want to clear the form using the reset method returned by useForm() all my TextInputs, RadioButtons and Checkboxes clears as expected, but the dropdown at first looks like nothing is happening, but if add something, but if adding something like the next code for forcing redrawing of the component it works

isReseting ? <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>

    <Text style={{ fontSize: ppf(16), color: colors.text }}>Reseteando...</Text>
</View>

: <Controller control={control} defaultValue={undefined} name='brand_id' rules={{ required: { value: true, message: 'Campo obligatorio' }, }} render={({ field: { onChange, onBlur, value, ...field } }) => ( <> <DropDown label='Marca*' mode={'outlined'} visible={showBrandDD} value={value} setValue={(_val) => { setValue('brand_id', _val); setSelectedBrand(_val); }} showDropDown={() => setShowBrandDD(true)} onDismiss={() => setShowBrandDD(false)} dropDownItemStyle={styles.dropDownItem} inputProps={{ style: styles.dropDown, placeholderTextColor: colors.placeholder, outlineStyle: styles.outlineStyle, right: <TextInput.Icon icon={menu-down} color={colors.disabledText} /> }} list={brands} /> <HelperText type={'error'}>{errors.brand_id?.message} </> )} />

Is this a bug? A missing feature? Better way to handle this?

[fateh999]

@sephirothtbm can you use the v2 version of the library as v1 is kind of deprecated.

also it would be helpful if you can provide a small expo snack featuring this issue.

[sephirothtbm]

Awesome, just updated to the latest version and now works like a charm. Didn't noticed there's and update to the lib and I have this issue pending from a week ago before the release.

Now that the issue is solved, do you still need the snack?

Thanks for all the work into this.

[fateh999]

Nope if the new version works for you we can mark the issue as closed.