reactjs - Uncaught Error : Element ref was specified as a string (editor) but no owner was set

Question

我正在使用react-markdown-editor包和之前我没有任何问题。但是在使用npm install更新react后，就会发生此问题。当页面呈现时，该组件会产生三个错误，并且所有页面都会变成空白。我做了研究，但没有发现任何有用的东西。我不知道如何解决这个问题。这是我在 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)}