react-bootstrap 相关问题

interface Range{ min: number, max: number } const defaultState : types.EqParamRange = { Max: 0, Min: -1, }; const [stateRange, setRange] = React.useState<types.Range>(defaultState); <Form.Group key="min" className="mb-3" > <Form.Label>Y-min</Form.Label> <Form.Control type='number' disabled={!enableCustomAxis} min={-40} max={30} step={1} value={Range.Min} onChange={(event) => { const target = event.target as HTMLInputElement const value = Number(target.valueAsNumber); setCustomYAxisRange( Range => ({ ...Range, Min: value })); }} required placeholder='Enter minimum value of Y-coordinate'> </Form.Control> </Form.Group>

reactjs typescript bootstrap-5 user-input react-bootstrap

回答 1 投票 0

react-bootstrap 5.3.3 offcanvas 的 offcanvas-backdrop 元素在单击 closeButton 时不会被删除

我在单端应用程序中使用v5.3.3中的react-bootstrap。一个表单显示在从屏幕右侧飞入的画布中。当关闭画布时，它会按预期工作...

reactjs react-bootstrap backdrop

回答 1 投票 0

为什么我的 React Bootstrap 下拉菜单没有关闭

我正在尝试使用 React-Bootstrap 中的下拉菜单，但无法使其工作。它不会关闭（而且它不是垂直的，只有当我使用带有 display: flex 和 flex-direction: column 的 CSS 时）（我正在使用 2....

javascript reactjs jsx bootstrap-5 react-bootstrap

回答 1 投票 0

为什么我的 Bootstrap 下拉菜单无法关闭

javascript reactjs jsx bootstrap-5 react-bootstrap

回答 1 投票 0

为什么我的 boostrap 按钮在点击时会向下伸展？

我有一个用于反应项目的引导登录页面组件。但是，我注意到，每当我单击登录按钮时，它都会一直向下延伸，我不知道为什么我......

javascript css reactjs bootstrap-5 react-bootstrap

回答 1 投票 0

为什么 React-bootstrap 中的 Navbar 组件没有导入到我的 NextJS 应用程序中？

我目前正在 next@15.0.4 应用程序上构建一个项目，使用 React v 18.3.1。我已经安装了react-bootstrap 2.10.6和bootstrap 5.3。但是，我在使用导航栏组件时遇到了问题...

next.js react-bootstrap

回答 1 投票 0

为什么没有填充 Formik `touched` 属性？

我正在使用 React、Formik、react-bootstrap 和 yup 制作一个表单进行验证。我正在尝试显示验证错误，但触摸的属性未填充字段。常量计划...

reactjs react-bootstrap formik

回答 3 投票 0

LinkContainer组件react-router-bootstrap错误有解决方案吗？

所以我使用react-router-bootstrap中的LinkContainer组件来包装bootstrap中的Nav.Link组件。请参考下图以供参考。 // 片段导入{LinkContainer...

javascript reactjs react-router-dom react-bootstrap react-router-bootstrap

回答 3 投票 0

删除 React Bootstrap 中的下拉箭头

我正在尝试使用以下CSS删除下拉箭头，但它没有产生任何效果。 .dropdown::之后{ 显示：无！重要； } 这是代码我正在尝试使用以下 css 删除下拉箭头，但它没有产生任何效果。 .dropdown::after{ display: none !important; } 这是代码 <NavDropdown className={classes.user} title="Componentes" id="collasible-nav-dropdown"> <NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item> <NavDropdown.Item href="#action/3.2">Another action</NavDropdown.Item> <NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item> <NavDropdown.Divider /> <NavDropdown.Item href="#action/3.4">Separated link</NavDropdown.Item> </NavDropdown> 这是 Bootstrap 下拉箭头中的 CSS：因此，为了覆盖它，您需要使用相应的 CSS 选择器： .dropdown-toggle::after { display: none !important; } 请注意，也许不需要包含 !important。不确定这是否已解决，我在选择下拉菜单时遇到了类似的问题，结果发现插入符号/箭头是背景图像，您可以将其设置为 CSS 中的背景图像：无来删除它。

css reactjs bootstrap-4 react-bootstrap

回答 2 投票 0

reactstrap和react-bootstrap有什么区别？

我发现了两个不同的reactjs引导程序 npm安装--保存reactstrap反应react-dom npm 安装react-bootstrap bootstrap 两者之间的基本和主要区别是什么？

reactjs react-bootstrap reactstrap

回答 3 投票 0

加载微调器未显示在 React JS Web 应用程序中

我试图在我的 React Web 应用程序中包含一个加载微调器，以在 API 获取数据时显示加载动画。下面是代码：从“next/head”导入头；导入反应，{

reactjs spinner react-bootstrap loading

回答 1 投票 0

Prime React 下拉过滤器无法正常工作

我正在使用 primereact/dropdown 来呈现我的位置列表，用户可以在列表中选择，但我也在下拉列表中使用过滤方法来使用户也可以进行搜索

reactjs bootstrap-4 bootstrap-modal react-bootstrap primereact

回答 1 投票 0

react-bootstrap 中的 Apexcharts 没有绘制图表，即使 console.log 显示 useState 能够从 Flask 中获取它

目标：从 Flask 获取数组的 json 转储并用 apexcharts 绘制它们的图表那么开始吧。 Flask 中有 6 个名为 arr 的元素列表，它以 json 形式返回返回 json.dumps(arr) 然后在反应-

react-hooks react-bootstrap apexcharts

回答 1 投票 0

栏目内容溢出栏目

我正在使用 React 和 Bootstrap。我定义了一个容器、一行和列。当屏幕缩小时，页面会做出响应，因为列相对于页面缩小或扩展。然而，...

reactjs react-native bootstrap-4 bootstrap-5 react-bootstrap

回答 1 投票 0

在react-bootstrap中更改NavDropdown的颜色和背景颜色

在react-bootstrap中使用我的NavDropdown，我无法设置其颜色或背景颜色的样式...... 使用 NavDropdown 中的 react-bootstrap，我无法设置其颜色或背景颜色的样式... <NavDropdown eventKey={3} className="text-center" style={{ fontSize: `130%` }} title="Items to Choose" > <LinkContainer to="/about"> <MenuItem eventKey={3.1} className="text-center">About</MenuItem> </LinkContainer> <MenuItem divider /> <LinkContainer to="/products"> <MenuItem eventKey={3.2} className="text-center">Products</MenuItem> </LinkContainer> <MenuItem divider /> <LinkContainer to="/blog-index"> <MenuItem eventKey={3.3} className="text-center">Blog</MenuItem> </LinkContainer> </NavDropdown> 我可以使用 style={{ fontSize: '130%' }} 更改字体大小，但我还想使用 .. 更改颜色和背景颜色 style={{ fontSize: '130%', color: '#fff', backgroundColor: 'blue' }} ...但是 color 和 backgroundColor 在括号内不起作用。我尝试做的一件事是将 <NavDropdown> 元素包装在样式 div 中，但这搞乱了导航栏元素的对齐方式。还可以提供标题文本作为 JSX 元素。 <NavDropdown title={ <span className="text-primary my-auto">Dropdown</span> } id="nav-dropdown" > <NavDropdown.Item>Action</NavDropdown.Item> <NavDropdown.Item>Another action</NavDropdown.Item> </NavDropdown> 并且不需要编写自定义 CSS，这可能是我们想要避免的。设置 NavDropdown 的 id 并为此 id 创建 css 样式。反应中： <NavDropdown title={"Example"} id="nav-dropdown"> 在 CSS 中： #nav-dropdown{ color: white; font-weight: bold; background-color: red; } 使用 Chrome 中的检查元素工具检查后。我通过在我的index.html中添加以下几行来使其工作' div.dropdown-menu.show { background-color: #000000; // for drop down menu color } a.dropdown-item { color: #ffffff; // for font color of individual drop down item } ` 对于您选择的选择器。您提供的代码结构中不存在这一点。您是如何想出选择器的？

css reactjs twitter-bootstrap-3 react-bootstrap

回答 4 投票 0

react-bootstrap 相关问题

最新问题