反应，通过dragonallySetInnerHTML在html中设置onClick

Question

我有一个txt组件，可以通过危险地设置InnerHTML呈现

它有这行：

lines[i] = lines[i].replace(capoRegex, "<div class='capo' onClick={this.toggleTranspose()}>$1</div>");

但是当我单击该元素时，出现此错误：

TypeError: this.toggleTranspose is not a function

如何从危险地调用SetInnerHTML来调用组件的功能？

Answer 1

您可以将其添加到父生命周期方法中

componentDidMount: function() {
    $('.capo').click(function(e){
        ...
    })
} 

看看这个Getting started

Answer 2

@victor zadorozhnyy的回答是正确的方向。我没有jquery，我需要访问组件setState方法，所以这是我的最终代码：

var component = this;
document.getElementById('capo').addEventListener('click', function(e) {
  transpose = parseInt(e.target.dataset["capo"]);
  component.setState({
    transpose: transpose
  });
}