React.createRef始终为null

时间:2018-08-17 01:20:18

标签: reactjs

我在这里可能做的事情确实很愚蠢,但是对于我一生来说,我不知道为什么ref总是为空。

import React, { PureComponent } from 'react';

class MyComponent extends PureComponent {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
    console.log(this.myRef);
  }

  componentDidMount() {
    console.log(this.myRef);
  }

  componentWillUnmount() {
    console.log('unmounting');
  }

  render() {
    console.log(this.myRef);
    return (
      <div ref={this.myRef}>
        foobar
      </div>
    );
  }
}

控制台:

{current: null}
{current: null}
{current: null}

我正在使用React 16.3。我想念什么?

3 个答案:

答案 0 :(得分:8)

omg,我的反应是16.3,但反应区是16.2。将React-dom提升到16.3可解决此问题。

答案 1 :(得分:1)

我使用this.myRef.value将我归零。现在,我使用此有效的this.myRef。当前

答案 2 :(得分:0)

这也可能是由于您的元素未安装在componentDidMount()

相反,请尝试在componentDidUpdate()内打印值