How can I use react-native-dropdown-picker(DropDownPicker) without open, setOpen properties?

Question

const [openDropdown, setOpenDropdown] = useState(false);

        <Controller
          control={control}
          name={EPaymentFormField.PROMOTION_COUPON_ID}
          render={({ field: { value, onChange } }) => {
            const handleChange = (callback: any) => {
              onChange(callback());
            };
            return (
              <DropdownPicker
                placeholder={t('paymentDetail_coupon_label', {
                  numOfAvailableCoupons: numOfAvailableCoupons,
                  numOfTotalCoupons: numOfTotalCoupons,
                })}
                open={openDropdown}
                setOpen={setOpenDropdown}
                value={value}
                setValue={handleChange}
                items={dropdownData}
                multiple={false}
              />
            );
          }}
        />

How can I use without open, setOpen properties on DropDownPicker? these are essential properties in this library. But I don't want to use useState.

So, If it can, I want to use it without open, setOpen properties or useState.

Is anyone knows solution?

score 0 · Answer 1 · answered Jun 17 '22 at 06:30

I don't think the lib forces you to use useState You should be able to pass a boolean is and a random function to like so :

<DropdownPicker
            placeholder={t('paymentDetail_coupon_label', {
              numOfAvailableCoupons: numOfAvailableCoupons,
              numOfTotalCoupons: numOfTotalCoupons,
            })}
            open={true}  // if you want to keep it open
            setOpen={() => return;}
            value={value}
            setValue={handleChange}
            items={dropdownData}
            multiple={false}
          />

How can I use react-native-dropdown-picker(DropDownPicker) without open, setOpen properties?

1 Answers1