React Hook 表單控制器

Question

我在材料 UI textField 組件上使用反應鈎子表單控制器，其中我給出的類型是文件。

<Controller
            name={name}
            control={control}
            render={({ field: { value, onChange } }) => (
              <ReactHookFormSelector
                selector={selector}
                type={type}
                multiline={multiline}
                value={value}
                onChange={(event) => {
                        console.log(event.target.files)
                        onChange(event.target.files)
                      }
                }
              />

在這里，我想在提交此表單時將此文件和值存儲在 redux 存儲狀態

我想稍后在另一個 Textfield(input=file) 組件中使用該文件和值。

任何人都可以幫助我如何將這個文件和值存儲在 redux 中並在以后使用它？

Answer 1

如果你使用react-hooks-form ，你可以對文件使用setValue 。

然后使用 react-hooks-form 中的watch或getValues()函數來訪問另一個組件中的狀態。

      onChange={(event) => {
        console.log(event.target.files)
         setValue("files",event.target.files[0].name)
         }
       }

然后使用手表：

const filesWatch = getValues("files")

更多在這里： https://react-hook-form.com/api/useform ://react-hook-form.com/api/useform