【React】实现锚点功能、点击按钮到顶部

先看需要实现的效果图：

实现方法：给标签添加id属性（往哪跳，就给哪个标签加），然后用下面的scrollToAnchor方法，废话不多说，直接上代码：

import React, { Component } from 'react';
class ComA extends Component {
    constructor(props) {
        super(props);
        this.state = {

        };
    }
    scrollToAnchor = (anchorName) => {
        if (anchorName) {
            let anchorElement = document.getElementById(anchorName);
            if (anchorElement) { anchorElement.scrollIntoView(); }
        }
    }
    render() {
        var doms = [];
        for (var i = 0; i < 24; i++) {
            doms.push(

                    
title{i}
                    
content{i}
                
);
        }
        return (
            

                
我是顶部
                {
                    doms.map(function (value) {
                        return value;
                    })
                }
                点我到顶部
                


                点我到title6的位置
            
        );
    }
}

export default ComA;

 

 

启蒙链接：https://www.jianshu.com/p/3ef8f490873d