Question

我正在使用react-markdown-editor包，之后我没有遇到任何问题。但在更新与npm install的反应后，会出现此问题。当页面呈现时，此组件产生三个错误，并且所有页面都变为空白。我做研究但没发现任何有用的东西。我不知道如何解决这个问题。这是我在chrome控制台中的错误：

invariant.js:42 Uncaught Error: Element ref was specified as a string (editor) but no owner was set. You may have multiple copies of React loaded. (details: https: //fb. me/react-refs-must-have-owner).
    at invariant (invariant.js:42)
    at coerceRef (react-dom.development.js:8579)
    at reconcileSingleElement (react-dom.development.js:9379)
    at reconcileChildFibers (react-dom.development.js:9477)
    at reconcileChildrenAtPriority (react-dom.development.js:10127)
    at reconcileChildren (react-dom.development.js:10118)
    at finishClassComponent (react-dom.development.js:10254)
    at updateClassComponent (react-dom.development.js:10226)
    at beginWork (react-dom.development.js:10605)
    at performUnitOfWork (react-dom.development.js:12573)

react-dom.development.js:8305 The above error occurred in the <MarkdownEditorContent> component:
    in MarkdownEditorContent
    in div
    in MarkdownEditor (created by TopicEditComponent)
    in div (created by TopicEditComponent)
    in div (created by TopicEditComponent)
    in div (created by TopicEditComponent)
    in div (created by TopicEditComponent)
    in form (created by TopicEditComponent)
    in div (created by TopicEditComponent)
    in TopicEditComponent (created by TopicComponent)
    in div (created by TopicComponent)
    in TopicComponent (created by CountryContainer)
    in div (created by CountryContainer)
    in CountryContainer (created by Connect(CountryContainer))
    in Connect(CountryContainer) (created by RouterContext)
    in div (created by CoreLayout)
    in div (created by CoreLayout)
    in CoreLayout (created by RouterContext)
    in RouterContext (created by Router)
    in Router (created by Routes)
    in Routes
    in Provider
Consider adding an error boundary to your tree to customize error handling behavior.
You can learn more about error boundaries at https: //fb. me/react-error-boundaries.


react-dom.development.js:1345 Uncaught Error: A cross-origin error was thrown. React doesn't have access to the actual error object in development. See https: //fb . me/react-crossorigin-error for more information.
    at Object.invokeGuardedCallbackDev (react-dom.development.js:1345)
    at invokeGuardedCallback (react-dom.development.js:1195)
    at performWork (react-dom.development.js:12800)
    at batchedUpdates (react-dom.development.js:13244)
    at performFiberBatchedUpdates (react-dom.development.js:1646)
    at stackBatchedUpdates (react-dom.development.js:1637)
    at batchedUpdates (react-dom.development.js:1651)
    at Object.batchedUpdatesWithControlledComponents [as batchedUpdates] (react-dom.development.js:1664)
    at dispatchEvent (react-dom.development.js:1874)

Answer 1

根据文章： Legacy Api String Refs

可能会在以后的某个版本中删除字符串引用

所以，请改用：

ref={input => (this.yourView = input)}

Answer 2

今天我遇到了同样的问题，在桌子上反复敲打我的头后，我找到了解决方案。

主要问题是重复的React安装，所以我必须告诉使用哪一个。我发现的解决方案是添加此代码

resolve: {
    alias: {
        'react': path.resolve(__dirname, 'path/to/your/react/installation/folder', 'react')
    }
}

在 webpack.config.js 中。

这段代码说明在哪里找到正确的反应安装（在我的情况下，我想指向“ node_modules ”文件夹）。

我找到了这个解决方案here所以所有的优点都去了' knoxjeffrey '：）

未捕获错误：元素引用被指定为字符串（编辑器）但未设置所有者

2 个答案: