Question

使用 react-bootstrap 模式时无法读取未定义的属性“Header”

2018-01-04

5527

reactjs bootstrap-modal react-bootstrap

我在我的项目中使用 react-bootstrap。当我使用 Modal 组件时出现如下错误。

modal 组件：

<Modal  show={this.state.modalshow} onHide={close}  container={this} aria-labelledby="contained-modal-title">
   <Modal.Header closeButton>
     <Modal.Title id="contained-modal-title">Add User</Modal.Title>
   </Modal.Header>

Answer 1

尝试在顶部添加

import Modal from 'react-bootstrap/lib/Modal';
// or
import { Modal } from 'react-bootstrap';

Arshpreet Wadehra

2018-01-04

Answer 2

首先使用以下命令安装 React bootstrap -

npm install --save react-bootstrap

之后从 react-bootstrap 导入 Modal

import {Button,Modal} from 'react-bootstrap'
<Button bsStyle="primary" type="submit">Create</Button>

如果此代码对您有效，即 react-bootstrap 工作正常，然后尝试使用您的模式代码将正常工作。
否则您在安装 react-bootstrap 时遇到问题。

Answer 3

这似乎不是 Modal 问题。如果您使用任何未定义的值，就会发生这种情况，但这并不意味着 Modal.Header 没有未定义。