一周前写的Component
import React,{Component} from 'react';
import {NavLink} from 'react-router-dom';
import store from 'store/index.js';
class Nav extends Component{
constructor(props){
super(...arguments);
var type = this.props.type
this.state = {
color:store.getState().color,
count:store.getState().memberInfo[type],
}
}
componentDidMount(){
store.subscribe((a,b)=>{
this.setState({
color:store.getState().color
})
})
}
render(){
const {url,ico,title} = this.props;
const {color,count} = this.state;
return (
<NavLink to={url} rel="nofollow" activeStyle={{color:color.bgColor,borderColor:color.bgColor,backgroundColor:color.underBg}}>
<i className={"tbzico "+ico}/><span className="subtitle">{title}</span>
<span className="count" style={{color:color.fontColor,backgroundColor:color.bgColor}}>{count}</span>
</NavLink>
)
}
}
export default Nav
问题是connect()()包装以后navlink的activeStyle不会更新,猜测是英文connect的shallow compare,所以我的代码里面没用connect,
但是昨天做性能检测时,这块的开销太大了,求指点迷津