我有一个非常基本的反应程序，但它不工作

Question

我尝试了一个非常基本的反应程序，其中我有三个 button 上面写着一些东西，每当有人点击它时，我的 h1 标签应该显示 button 被点击。

import React, {Component} from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  constructor() {
    super(); 
    this.state = {
      title: '',
    }
  }
  handleClick = (e) => {
    this.setState({title: e.currentTarget.value}, () => console.log(this.state.title))
  }
  render(){
    return <div className = 'container'>
    <h1>{this.state.title}</h1>
    <button onClick = {this.handleClick}>Hello World</button>
    <button onClick = {this.handleClick}>Bye World</button>
    <button onClick = {this.handleClick}>Good Bye World</button>
    </div>
  }
}

export default App;

当我记录我的事件时，我看到 event.currentTarget.name 的值设置为“当前目标”（这很奇怪）并且目标值为 null。我做错了什么？

Answer 1

按钮的值由其 value 属性和 name 但 name 属性决定。您的按钮没有 value 或 name 属性。

您可能正在寻找 e.currentTarget.textContent?

Answer 2

将e.currentTarget.value替换为e.currentTarget.innerText就可以了。

我有一个非常基本的反应程序，但它不工作

I have a very basic react program, but it's not working

javascript

reactjs

react-dom