react+hashRouter+锚点功能

antd的锚点坑太大，a标签锚点又在用hashRouter的时候不适用，只能自己想办法了，经过试验，总结了以下方法：

1、

HeaderTabs: [

{

href: 'auction-detail',

text: '拍卖详情'

},

{

href: 'standard-detail',

text: '标的详情'

},

{

href: 'others-detail',

text: '其他'

},

{

href: 'technological-process',

text: '流程'

}

]

2、scrollToAnchor = (anchorName) => {

if (anchorName) {

let anchorElement = document.getElementById(anchorName);

console.log(anchorElement)

if(anchorElement) {

this.setState({

curTab: anchorName

})

let scrollHeight = anchorElement.offsetTop - 65;

console.log(scrollHeight)

window.scrollTo(0,scrollHeight);

}

}

}

3、<div className="ant-anchor">

{

HeaderTabs.map((item,index)=>

<div className={`${curTab === item.href ? 'ant-anchor-link-active' : ''} ant-anchor-link`} key={index}>

<a className={`${curTab === item.href ? 'ant-anchor-link-title-active' : ''} ant-anchor-link-title`} onClick={()=>this.scrollToAnchor(item.href)} title={item.text}>{item.text}</a>

</div>

)}

</div>