Почему ссылка в реагировать является нулевой здесь? - PullRequest
Новая
       32

Почему ссылка в реагировать является нулевой здесь?

1 голос
/ 15 мая 2019

Я экспериментировал с popmotion pure, так как анимация должна будет использовать "ref", я использую его.
Здесь, почему значение ref (number) равно нулю. 

import React from 'react'
import {
  styler,
  tween,
  merge,
  action,
  easing
} from "popmotion";

class Demo extends React.Component {
  constructor(props) {
    super(props)
    this.count = React.createRef();
  }

  componentDidMount() {
    const number = this.count.current.querySelector('#count');
    const updateCounter = (v) => {
      console.log(v)
      return (number.innerHTML = v)
    }

    tween({
      from: 0,
      to: 300,
      flip: Infinity,
      duration: 4000
    }).start(updateCounter);
  }

  render() {

    return ( 
      <div>
        <p  ref={this.count} id='count'></p>
        <div id="ball"></div>
      </div>
    )
  }
}

export default Demo

Он возвращает ошибку как TypeError: Cannot set property 'innerHTML' of null

Однако, если я использую этот документ вместо нуля, он работает нормально 

 const number = document.querySelector('#count');

Может кто-нибудь, пожалуйста, проведите меня через.Спасибо

1 Ответ

1 голос
/ 15 мая 2019

используйте 

const number = this.count.current;

вместо 

const number = this.count.current.querySelector('#count');

Смотрите живой пример

...