reactjs - 提交后重置 React-Select (Unform)

标签 reactjs typescript

我正在研究 ReactJS 和 Typescript,还有一个名为 Unform (https://github.com/Rocketseat/unform) 的表单库。

我有一个包含一些字段的表单,包括一个选择字段 ( https://react-select.com/ )。我的问题是:如何在提交表单后清除这个 react-select 字段?

我的项目存储库:https://github.com/fredarend/icetec-frontend

表单位于:src/pages/Dashboard/indext.tsx,Select 组件位于 src/components/Select/index.tsx

请注意,在仪表板索引中,我已经在将数据发送到 API 后使用了 formRef.current?.Reset(),但是,它只是重置输入,Select 不会继续有待填补。

我无法实现任何有效的方法,也许有人已经做到了?

预先感谢您的帮助!

最佳答案

以下是您可以执行的操作:

在你的Dashboard --> index.js handleSubmit 下,formRef.current?.reset(); 添加以下内容:

formRef.current?.reset()

//add these 2 lines:

const select = formRef!.current!.getFieldRef('technologies');
select.select.clearValue()

这将允许您通过 ref 获取 react-select 组件并重置它。

关于reactjs - 提交后重置 React-Select (Unform),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63782116/

相关文章:

javascript - ReactJS this.props.history.push 不存在! this.props 不包含历史

angular - 在非 Angular 类中获取注入(inject)的依赖项

reactjs - 使用导入类型时出现意外 token

reactjs - 使用 React 的浏览器后退按钮

android - 如何在 React Native 中创建对角线边框?

html - Angular 8 嵌套对象插值

javascript - 基于JSON对象动态创建表单

visual-studio - 找不到 VSTS 指定的 TypeScript 编译器

javascript - 如何从对象中删除未定义的属性?

javascript - React-Router 客户端