頁面切換導致導航重新渲染出現閃爍,有什么解決的辦法嗎
import?React,?{?Component?}?from?'react';
import?"./index.css";
const?tabbarArr?=?[
??{
????className:?'icon-gouwuche',
????text:?'購物車',
????path:?'/catetory'
??},
??{
????className:?'icon-HOMEMESSAGE',
????text:?'首頁',
????path:?'/'
??},
??{
????className:?'icon-yonghu',
????text:?'用戶',
????path:?'/user'
??},
??{
????className:?'icon-lanlvtubiaozhizuomoban-01',
????text:?'分類',
????path:?'/classify'
??},
]
const?TabBar??=?(WarppedComponent)=>?class?Tabbar?extends?Component?{
??static?displayName?=?`Tabbar(${WarppedComponent.displayName?||?WarppedComponent.name?})`;
??tabbarChange(i){
????const??{?path?}?=?tabbarArr[i]
????this.props.history.push(path)
??}
??render?()?{
????const?{?path?}?=?this.props.match;
????return?(
??????<div>
????????<div?className="showContent">?
??????????<WarppedComponent?{...this.porps}/>
????????</div>
????????<div?className={?'Tablebar'?}>
??????????{
????????????tabbarArr.map((item,i)=>?(
??????????????<div?className={"taber-item"??+?(path?===?item.path???'?active-tabar'?:?'')}?key={i}>
????????????????<div?className={?'iconfont?'?+?item.className}?style={{"fontSize":"20px"}}?onClick={()=>?this.tabbarChange(i)}></div>
????????????????<div>{item.text}</div>
??????????????</div>
????????????))
??????????}
????????</div>
??????</div>
????)
??}
}
export?default?TabBar