Question

我试图在导航栏组件中嵌套模态组件，但我想出了以下错误：

Error: _processChildContext is not available in React 16+. This likely means you have multiple copies of React and are attempting to nest a React 15 tree inside a React 16 tree using unstable_renderSubtreeIntoContainer, which isn't supported. Try to make sure you have only one copy of React (and ideally, switch to ReactDOM.createPortal).

我的代码：

import React, { Component } from 'react';
import { Navbar, NavItem, Modal, Button } from 'react-materialize';


class Header extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showLoginModal: false
    };
    this.toggleLoginModal = this.toggleLoginModal.bind(this);
  }

  toggleLoginModal() {
    this.setState({ showLoginModal: !this.state.showLoginModal });
  }


  render() {
    console.log(this.state.showLoginModal);
    return (
    <div>
      <Navbar brand='Voting App' right>
        <Modal
          header='Login'
          trigger={<Button>Login</Button>}
        >
          Login
        </Modal>
      </Navbar>
    </div>
    )
  }
}

export default Header;

为什么会出现这种情况？一直试图找出使用物化样式引入模态的最佳方法，但是撞到了很多砖墙。任何帮助都非常欢迎！

Answer 1

将纱线从0.x升级到1.x，或相应地将NPM升级并再次尝试。基于此post，它应该有用。

Answer 2

如果遇到此问题，升级纱线将无法解决任何问题。您需要删除并重新安装一些冲突的软件包。升级yarn可能会删除这些文件，但是如果您使用的是npm；升级npm不会删除文件，也无法提供解决方案。

要删除模块：

如果您使用npm：Command to remove all npm modules globally?

如果您使用毛线：https://github.com/yarnpkg/yarn/issues/1048

模态在React-Materialize中不起作用

2 个答案: