Калькулятор React: ограничение количества входов

Вы можете использовать регулярные выражения, чтобы решить эту проблему. Основная проблема с использованием подхода, основанного на includes(), заключается в том, что он не обеспечивает правильный формат во входной строке. Может быть, вы могли бы использовать такое регулярное выражение?

/^\d*([/\+-/*=]\d+)*$/gi

Это предотвратит такие проблемы, как несколько операндов, например +++ и т. Д.

class Calculator extends React.Component {

  constructor(props) {


 super(props);
    this.state = { value: "" };
    this.handleClick = this.handleClick.bind(this);
  }
  handleClick(evt) {

    const result = evt.target.value;

    // Update state
    this.setState({
      value: result
    });

    // Comine previous state with input value
    //const combination = `${ this.state.value }${result}`;
    console.log(result, 'combination', result)
        // Use regular expression to check valid input. If invalid
    // prevent further processing
    if(!result.match(/^\d*([/\+-/*=]\d+)*$/gi)) {
      console.error('Invalid input')
      return
    }

        this.setState({ calculated: eval(result) });

  }

  render() {
  return <h1>
  <input value={this.state.value} onChange={(e) => this.handleClick(e)}/>
  <p>{ this.state.calculated }</p>
  </h1>
  }
}

ReactDOM.render(<TodoApp />, document.querySelector("#app"))

Здесь есть работающий JSFiddle, который вы можете попробовать