我正在一个使用Bootstrap 4的React项目上工作。Bootstrap是通过CDN导入的。
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
我想要的是在满足条件时显示或隐藏一个模态框。我已经导入了jQuery并使用了它。
npm install jquery --save
在组件中
import $ from 'jquery'; <-to import jquery
$('#addSupModal').modal('show'); <- to show modal
但是在执行时,当上述行被执行时,会显示以下错误:
Unhandled Rejection (TypeError): __WEBPACK_IMPORTED_MODULE_4_jquery___default(...)(...).modal is not a function
我读到了关于这个错误的文章,它说可能是因为使用了CDN和npm两种方式重复导入了jquery库。我不确定具体原因。但我也试着只用一种方法导入了jquery,但它并没有奏效。有什么建议吗?