javascript 如何在ReactJs中获取click事件的label标签中的文本?

y3bcpkx1  于 2023-03-28  发布在  Java
关注(0)|答案(1)|浏览(166)

我试图在标签的点击事件中获取标签标签内的文本。下面是我的代码。

import React from 'react';

class Todo extends React.Component {
    constructor(props) {
        super(props);
        this.handleOnClick = this.handleOnClick.bind(this);
    }

    handleOnClick(e) {
        e.preventDefault();
        console.log(e.target.value);
        this.props.onToggle(e.target.value);
    }

    render() {
        return (<div>
                            <label onClick={this.handleOnClick}>{this.props.taskName}</label>
                            <button>Edit</button>
                            <button>Delete</button>
                        </div>);
    }
}

module.exports = Todo;

但在控制台日志中得到未定义。有人能告诉我应该是正确的方式来获得这个值。

kwvwclae

kwvwclae1#

只有输入字段有值,标签没有。
该值不会在事件对象中,因此您必须以不同的方式执行此操作:

<label onClick={() => this.handleLabelClick(this.props.taskName)}>
  {this.props.taskName}
</label>

handleLabelClick将任务名称作为参数。

相关问题