Оповещать содержимое поля ввода при нажатии кнопки - Реагировать - PullRequest
Новая
       11

Оповещать содержимое поля ввода при нажатии кнопки - Реагировать

0 голосов
/ 03 января 2019

Я делаю простую программу в React для оповещения о содержимом поля ввода одним нажатием кнопки. Я не могу сделать это. Может кто-нибудь помочь мне, пожалуйста? Я из углового фона! 

class App extends React.Component {
  render() {

      this.state = {
      	text1: "hello"
      }

    return (
    <div>
        <input type="text" value={this.state.text1}/>
        <button onClick={alpha}>Click</button>
    </div>
   )

   alpha(){
   	alert(this.state.text1);
   }

  }
}
ReactDOM.render(<App/>, document.getElementById('app'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.js"></script>
<div id="app"></div>

1 Ответ

0 голосов
/ 03 января 2019

У вас есть несколько проблем с вашим кодом. Функция состояния и альфа не должна быть внутри рендера, и вам нужно будет инициализировать ваше состояние и связать альфа-функцию в конструкторе, чтобы получить доступ к ним из остальной части вашего класса. Следующий переработанный код должен работать на вас: 

class App extends React.Component {
  constructor(props) {
      super(props);

      this.state = {
          text1: "hello"
      };

      this.alpha = this.alpha.bind(this);
  }

  alpha() {
    alert(this.state.text1);
  }

  render() {
    return (
      <div>
        <input type="text" value={this.state.text1} />
        <button onClick={this.alpha}>Click</button>
      </div>
    );
  }
}
...