为了账号安全,请及时绑定邮箱和手机立即绑定

页面切换导致导航重新渲染出现闪烁,有什么解决的办法吗

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



正在回答

举报

0/150
提交
取消

页面切换导致导航重新渲染出现闪烁,有什么解决的办法吗

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信