我有一个使用reactstrap的react应用程序(bootstrap4)。我使用react-router为导航创建了一个简单的布局。我不明白为什么当你点击一个navbar项目时会闪现。我使用的是react-router-dom中的内置NavLink,它保持选中的NavItem高亮显示。
这里是网站的链接
标题组件
import {
Collapse,
Navbar,
NavbarToggler,
Nav,
NavItem,
NavbarBrand,
NavLink } from 'reactstrap'
import { NavLink as RRNavLink } from 'react-router-dom'
const Item = ({link, label}) => (
<NavItem>
<NavLink exact activeClassName='active-tab' to={link} tag={RRNavLink}>{label}</NavLink>
</NavItem>
)
const ROUTES = []
export default class extends React.Component {
render () {
return (
<div className='header-bkg'>
<Navbar color='faded' light expand='md'>
<NavbarBrand className='text-white'>Star Designs</NavbarBrand>
<NavbarToggler onClick={this._onToggle} />
<Collapse isOpen={this.state.isOpen} navbar>
<Nav className='ml-auto' navbar>
{ROUTES.map((x, i) => (
<Item key={i} {...x} />
))}
</Nav>
</Collapse>
</Navbar>
</div>
)
}
}
CSS
.header-bkg {
box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.6), inset 0 -1px 1px rgba(0, 0, 0, 0.6), 0 0 5px rgba(0, 0, 0, 0.6);
border-top: 0 solid rgba(47, 46, 46, 1);
border-bottom: 0 solid rgba(47, 46, 46, 1);
background-color: #d7a29e;
}
.nav-link:hover,
.nav-link:active {
background-color: #ede9e2;
}
.nav-link {
text-transform: uppercase;
}
.active-tab {
background-color: #ede9e2;
}
:focus {
outline: -webkit-focus-ring-color auto 0;
}
@media (max-width: 575px) {
}
@media (max-width: 767px) {
}
@media (max-width: 991px) {
}
@media (max-width: 1199px) {
}
单击菜单项时,一些js代码在折叠navbar-collable
元素上添加height:0px
(用于移动视图中关闭下拉动画效果),然后在几毫秒后将其删除。添加以下样式,它将不允许height 0
在桌面视图中应用,因为它具有更高的特异性和重要属性。因此,不会发生闪烁。
@media (min-width: 768px) {
.navbar-expand-md .navbar-collapse {
height: auto !important;
}
}
本文向大家介绍wxPython之解决闪烁的问题,包括了wxPython之解决闪烁的问题的使用技巧和注意事项,需要的朋友参考一下 利用Python生成PDF文件时,对比了fpdf和reportlab两个库。fpdf最新更新还是2015年, 另外reportlab的资料网上更多一些。所以选择使用reportlab。 pdfgen pdfgen包是生成PDF文档最底层的接口。一个pdfgen编程实质是一
这是因为在开发模式下,为了通过 Webpack 实现热加载,CSS代码是打包在 JavaScript 代码中,并动态打到页面中去,从而元素重绘引起了闪烁。 不用担心,在生产模式下,CSS代码会单独打包至独立的文件并置于head标签内,不会出现页面闪烁的现象。
在我的反应原生应用程序中,我有一个切换导航器来在认证堆栈和应用堆栈之间导航: 它可以工作,但是当我从AuthStack转到AppStack时,它会闪烁,屏幕会向上移动。我如何防止这种行为增加平稳过渡。
问题内容: 我现在正在编写一个JApplet,每当我调用super.paint()时,该applet都会闪烁。我正在使用双缓冲(先绘制图像,然后渲染该图像),但我认为super.paint()正在清除屏幕或其他东西,打败了我的双缓冲。 我知道我应该使用paintComponents(),但是由于某些原因,当我调用“ currentScreen.Draw(g)”时,它不会显示屏幕的绘制。 谁能帮我这
我正在开发一个简单的聚合,它对给定资源上发生的事件总数进行汇总(请参阅:在flink中计算总数并定期发射)。在一些人的帮助下,我成功地完成了这项工作,但现在我遇到了另一个问题。 我试图计算资源生命周期的总数,但我正在从保留期为24小时的kinesis流中读取事件。因为这意味着我无法访问在此之前发生的事件,所以我需要从一个每天计算一次总数的遗留(批处理)系统引导我的状态。 基本上,我希望以某种方式从
本文向大家介绍C#控件闪烁的解决方法,包括了C#控件闪烁的解决方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了C#控件闪烁的解决方法。分享给大家供大家参考。具体分析如下: 如果你在Form中绘图的话,不论是不是采用的双缓存,都会看到图片在更新的时候都会不断地闪烁,解决方法就是在这个窗体的构造函数中增加以下三行代码: 请在构造函数里面底下加上如下几行: 参数说明: UserPaint 如