实现选择货币选择器不起作用

Question

我正在使用react-select-currency，它给了我：未处理的运行时错误 类型错误：_this.props.onChange 不是函数。 步骤：我在项目的类型目录中创建了一个名为react-select-currency.d.ts的新文件 包：https://www.npmjs.com/package/react-select-currency

 <FormField
             control={form.control}
             name="currency_type"
             render={({ field }) => (
                                 <FormItem className="md:col-span-1 ">
                                                    
                                 <FormLabel>Currency</FormLabel>
                                   <SelectCurrency
                                     onCurrencySelected={(selectedValue: string) => {
                                                            console.log("Selected Value: ", selectedValue);
                                                            // field.onChange(selectedValue);
                                                        }}
                                     value={field.value}
                                     className="w-full"
                                     key={field.value}
                                                    />
                                  <FormMessage />
                                 </FormItem>
                                )}
                              />

我尝试了文档仍然不适合我。任何人都可以帮我吗？

Answer 1

我实现了自定义货币选择器，并使用react-flag-kit作为Flag Ui示例代码，因为该代码比任何包都为我提供了更多的灵活性。

export const currencies = [
    { currency: "USD", countryName: "United States", symbol: "$", iso: "US" },
    { currency: "AFN", countryName: "Afghanistan", symbol: "؋", iso: "AF" },
    { currency: "ALL", countryName: "Albania", symbol: "L", iso: "AL" },
      Add more here...
}

使用它的代码示例如下：

<Combobox data={currencies.map((currency: CurrencySelector) =>
                           ({ value: currency.currency, label: ( <FlagIcon code={currency.iso as FlagIconCode} /> {currency.countryName} ({currency.currency}) ), }))}
                            onSelect={(selectedValue) => {
                                                    field.onChange(selectedValue);
                                     }}
                            defaultValue={field.value}
/>