Question

我是ReactJS的新用户，并尝试在用户使用javascript提供反馈时尝试禁用两个div的点击事件。提供的任何援助将不胜感激。我如何使用以下代码执行此操作：

<ul>
    <li>
        <a class="sound" href="http://example.com/sound1.mp4">
            <img src="images/duck-belgium.png" class="img-responsive">
        </a>
    </li>
    <li>
        <a class="sound" href="http://example.com/sound2.mp4">
            <img src="images/duck-china.png" class="img-responsive">
        </a>
    </li>
    <li>
        <a class="sound" href="http://example.com/sound3.mp4">
            <img src="images/duck-spain.png" class="img-responsive">
        </a>
    </li>
</ul>

Answer 1

在React中，您希望通过更改状态来触发重新渲染，以便更改组件。就像您已经在使用类一样，使用内联条件来更改标记的输出。

// change
onClick={this.submitRating.bind(this, 10)}
// to
onClick={this.state.someCondition ? this.submitRating.bind(this, 10) : null}

一旦你的点击事件（和ajax？）填充完成，只需使用this.setState来触发重新渲染，就像你已经在使用这些类一样。

编辑：

假设您希望点击监听器在phase更改时禁用，您可以使用：

onClick={this.state.phase == this.FEEDBACK_PHASE ? this.submitRating.bind(this, 10) : null}

当用户提供反馈时禁用单击事件

1 个答案: