点击提交按钮触发错误：Argument appears to not be a ReactComponent

这个错误的核心是：你把一个非React组件的对象当成React组件来使用了，这个对象带有focus、blur、scrollTo这些DOM元素特有的方法，大概率是误把DOM元素/Ref实例当成了React组件去传递或渲染。

常见场景及解决方法 #

• 误将Ref指向的DOM元素当作组件使用
  比如你可能在提交逻辑里写了类似 <SomeComponent>{inputRef.current}</SomeComponent>，或者把ref.current直接传给了需要React组件的地方（比如路由配置、高阶组件）。
  解决：把DOM操作和组件渲染拆分，React组件只能传函数组件/类组件，DOM元素只用来做focus()这类DOM操作，不要混在一起。

• 组件库API使用错误
  调用某些UI组件的方法后，返回的是组件实例或DOM元素，你错误地把这个实例当作组件去渲染。比如拿到某个弹窗组件的ref实例，然后试图把它作为<PopupInstance />来使用。
  解决：查看提交触发的代码里调用的组件方法，确认返回值类型，不要把实例对象当组件渲染。

• 高阶组件（HOC）参数错误
  如果用了withRouter、connect这类HOC，你传给HOC的不是合法的React组件，而是DOM引用或普通对象。
  解决：检查HOC的传入参数，确保是标准的React函数/类组件。

快速排查步骤 #

1. 打开控制台的调用栈（对应你截图里的调用信息），定位到报错的具体代码行
2. 打印报错位置的“组件”参数，看它的类型——如果是HTMLElement或者带有focus/blur的对象，就是把DOM元素当组件用了
3. 修正逻辑：需要渲染的地方传React组件，需要操作DOM的地方用Ref调用方法

内容的提问来源于stack exchange，提问作者dydanyu