javascript - react : Accessing a target element as 'this'

Question

这个问题可能之前已经被回答过，但我似乎无法用谷歌搜索它，因为它与 .bind(this) 问题有点重叠。

我想要做的是在运行函数时将调用元素引用为 this ，例如

highlight()
{
  this.select();
}

<input value={final_line} onClick={this.highlight} ></input>

但是，点击后this未定义。那么最好的方法是什么？现在我使用 event.target 作为替代品，它有效。我还看到使用了 ref，但不确定这是否适用，因为我返回了 input 数组。

所以我的总体问题是:是否有使用 event.target 的替代方案？

Answer 1

我同意GG的观点。 - 您应该使用 event.target，但另一种方法是使用 refs :

import { Component } from 'react';
import React from 'react';

class MyComponent extends Component {
  render() {
    const { final_line } = this.props;

    return <input value={final_line}
      onClick={ this.highlight.bind(this)}
      ref="inputToHighlight"
    />;
  }

  highlight() {
    this.refs.inputToHighlight.select();
  }
}