Question

我找到了一个具有“解锁滑动功能”功能的代码段（https://codepen.io/souporserious/pen/XJQLEb），并尝试在我的react组件中实现它（进行了一些更改，例如class = className）。现在，我得到一个错误：TypeError：无法设置未定义的属性“ min”，我无法解决。我忘了更换零件吗？

pip3 install pyinstaller
pyinstaller --onefile <your_script_name>.py

Answer 1

您的代码无法正常工作，因为findElementByClassName返回null，并且找不到具有类名pullee的元素。

您的代码可在render函数中找到，因此，在您的代码运行时，尚未将组件的HTML注入dom。

因此，建议将所有与您的DOM相关的代码移到componentDidMount函数或活动钩子中。

更多详细信息here

Answer 2

首先，使用引用比使用getElementBy更好，我建议的第二件事是将函数提取到类范围并绑定它们。

<input
    type="range"
    // Using ref
    ref={(el) => { this.inputRange = el; }}
    defaultValue={0}
    min={0}
    max={150}
    className="pullee"
/>

...
  constructor(props) {
    super(props);
    // binding function in constructor method
    this.unlockStartHandler = this.unlockStartHandler.bind(this);
    this.unlockEndHandler = this.unlockEndHandler.bind(this);
    this.animateHandler = this.animateHandler.bind(this);
    this.successHandler = this.successHandler.bind(this);
    this.maxValue = 150;
    this.speed = 12;
    this.currValue = 0;
    this.rafID = null;
  }
...

我为您做了codepen的工作，在这里有很多解释，但希望对您有所帮助。

React如何修复“滑动解锁”错误消息？

2 个答案: