Question

这是组件构造函数，我已经绑定了函数checkActive，它将父组件中的props与参数进行比较。

constructor(props) {
    super(props);

    this.checkActive = this.checkActive.bind(this);
  }

  checkActive(option) {
    if (this.props.active === option) {
      return 'active';
    }
  }

我想渲染“活跃”。我的一个div。所以我从：

开始

<div {this.checkActive('meet')}>

我想将其呈现为：<div active>

错误显示：意外的令牌，预期......

我是否将函数设置错误或者我们无法在div中传递函数？

Answer 1

<div active={this.props.active === "meet" ? "true" : void 0} />

Answer 2

您可以在className

中使用div下面的有效组件

<div className={this.props.active === "meet" ? "active" : ""} />

Answer 3

我认为您可以通过这种方式尝试

 <div className={this.props.active == "meet"?"active":""} />

如何调用div React Component jsx中的函数

3 个答案: