react，这就开始了。

react的一个特点，就是所谓虚拟dom。虚拟者，就是只存在于逻辑运算中，物理并不存在。因此，想获取或者设置dom，用以前的document.getElementById()之类的方法是不行的。应该用ref。

有代码有真相

/**
 * 跳到网站前端
 */
 import React, { Component } from 'react';
 import ReactDOM from 'react-dom';
 import styles from './index.less';// 自己定义的样式文件

 class Jump extends Component {

    constructor(props) {//构造函数
        super(props)
        this.state = {}
    }

    componentDidMount() {//本组件加载完成
      let self = this;// 保存this指针。否则在子函数里，this指向恐怕不同。
      this.loopData(self);
    }
  
    componentWillUnmount() {//本组件卸载时
      // clearTimeout(this.timer);
    }
  
    loopData = (self) => {
      var timer = setInterval(function () {
        var token = localStorage.getItem('token');
        if (!token) {
          return;
        }
        clearInterval(timer);

    // 将读取到的token值展示到<span>里
    // 这个span，就是所谓的虚拟dom
        let mySpan = self.refs["spToken"],
        mySpanDOM = ReactDOM.findDOMNode(mySpan);        
        mySpanDOM.innerHTML = token;
      }, 500);
    };

    render() {
      return (
        <>
          <div>
            <span className={styles.normal}>登录中，请稍候...</span>
          </div>
          <div>
            <span ref="spToken" className={styles.normal}></span>
          </div>
        </>
      );
    }
  }
  
  export default Jump;

上面例子中，最后一个​​<span>​​​ 使用了ref=“spToken”，react就可以据此找到实际输出时的​​<span>​​。

<span ref="spToken" className={styles.normal}></span>

let mySpan = self.refs["spToken"],
mySpanDOM = ReactDOM.findDOMNode(mySpan);        
mySpanDOM.innerHTML = token;

我目前刚接触react。从代码看，constructor，componentDidMount，componentWillUnmount都是react组件中固有的方法。