个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我有一些警告:
Warning: Legacy context API has been detected within a strict-mode tree.
The old API will be supported in all 16.x releases, but applications using it should migrate to the new version.
Please update the following components: Transition
Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Transition which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely in ...
<Modal
style={{position: "relative",
top: "50%",
transform: "translateY(-50%)"}}
className="fadein-elements"
isOpen={modal}
toggle={toggle}
>
<ModalHeader toggle={toggle}>Add Post</ModalHeader>
<ModalBody>
<Form onSubmit={onSubmit}>
<FormGroup>
<Label for="subject">Subject</Label>
<Input
type="text"
name="subject"
id="subject"
placeholder="Add Subject..."
onChange={onChange}
/>
<Label for="content">Content</Label>
<Input
type="textarea"
name="content"
id="content"
placeholder="Add content..."
onChange={onChange}
/>
<Button
color="dark"
style={{ marginTop: '2rem' }}
block>
Add Post
</Button>
</FormGroup>
</Form>
</ModalBody>
</Modal>
最佳答案
我在 NextJS 中使用 Bootstrap 5 时遇到了同样的问题。所以我不确定这是否与您之前提到的方式相同，但如果相似，您可以使用相同的解决方案。
警告是由于未从 Bootstrap 添加 CSS & JS Bundle 引起的。我编辑了我的 _app.js 文件，如下所示，它成功了。
import React from 'react'
import Head from 'next/head'
import Link from 'next/link'
import Script from 'next/script'
// add bootstrap css
import 'bootstrap/dist/css/bootstrap.css'
class App extends React.Component {
render() {
const { Component, pageProps } = this.props
return (
<>
<Head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<Link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
crossOrigin="anonymous"
/>
</Head>
<Component {...pageProps} />
<Script
id = 'bootstrap'
src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossOrigin="anonymous"
/>
</>
)
}
}
export default App
关于node.js - 使用 reactstrap 模态的警告，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/62159807/
25
4
0
我来自 Asp.Net 世界，试图理解 Angular State 的含义。 什么是 Angular 状态？它类似于Asp.Net中的ascx组件吗？是子页面吗？它类似于工作流程状态吗？ 我听到很多人
我一直在寻找 3 态拨动开关，但运气不佳。 基本上我需要一个具有以下状态的开关: |开 |不适用 |关 | slider 默认从中间开始，一旦用户向左或向右滑动，就无法回到N/A(未回答)状态。 有人
我是一名优秀的程序员,十分优秀！