TypeError：无法读取 null reactJs 的属性“值”答案

【问题标题】：TypeError: Cannot read property 'value' of null reactJsTypeError：无法读取 null reactJs 的属性“值”
【发布时间】：2021-02-16 19:49:18
【问题描述】：

我收到以下错误 TypeError: Cannot read property 'value' of null 在这种情况下我需要对 value 做什么，请帮助我。我是否需要为 value 赋值

function makeSearch() {
  var qty = document.getElementById('qty').value;
  if (qty > 5) {
    alert("Maximum 5 toy available.")
    return false
  }
  var cname = document.getElementById('cname').value;
  var tenure = document.getElementById('tenure').value;
  var toy = document.getElementById('toy_name').value;
  var rent = qty * tenure * toy;
  var answer = window.confirm("Total rental cost = " + rent);
  if (answer) {
    alert("Thank you for order Mr/Ms/Mrs: " + cname);
    window.location.reload();
  } else {
    alert("Order cancelled.")
    window.location.reload();
  }
  return false
}

code after
return :

  <
  tr >
  <
  td >
  Number Of toys available <
  /td> <
td >
  <
  input type = "number"
name = "avail"
id = "avail"
value = ""
readonly ref = ""
required > < /input> < /
  td > <
  /tr> <
tr >

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

您正在尝试访问不在页面上的元素的值。

即使元素已经在页面上，您也会遇到这样的代码问题，因为var cname = document.getElementById('cname').value; 将在元素安装到页面之前运行。

另一个问题是，在 react 中，您不应该使用 document.getElementById 来从中获取价值。

正确的方法是使用react useState hook react hooks

【讨论】：