Question

我正在遵循 Mosh Hamedani 的教程here来创建 react-app 。

我完全按照他说的做。

我正在尝试将名为product的参数传递给为onClick调用的函数但是，我遇到一个错误，但没有找到太多信息。

代码如下：

import React, { Component } from "react";

class Counter extends Component {
  state = {
    count: 0
  };

  formatCount() {
    return this.state.count === 0 ? "Zero" : this.state.count;
  }

  handleIncrement = product => {
    console.log(product);
    this.setState({ count: this.state.count + 1 });
  };

  render() {
    return (
      <React.Fragment>
        <span className={this.formatSpan()}>{this.formatCount()}</span>
        <button
          onClick={() => this.handleIncrement(product)}
          className="btn btn-primary"
        >
          Increment
        </button>
      </React.Fragment>
    );
  }
}

export default Counter;

这是错误：

无法编译。

./ src / components / counter.jsx第41行：未定义“产品”   没有undef

搜索关键字以详细了解每个错误。

Answer 1

产品从未在您的组件中定义。因此未定义。您可以将产品声明为组件状态，或将产品作为道具传递给组件。

Answer 2

您将产品作为未定义的变量传递传递带有反逗号的参数，否则将其声明并赋值。

使用

onClick={() => this.handleIncrement("product")}

Answer 3

以下代码对我有用：

onClick={(product) => this.handleIncrement(product)}

未在React-app中定义变量no-undef

3 个答案: