app.js

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

const value1 = Math.floor(Math.random() * 100);
const value2 = Math.floor(Math.random() * 100);
const value3 = Math.floor(Math.random() * 100);
const proposedAnswer = Math.floor(Math.random() * 3) + value1 + value2 + value3;
let numQuestions = 0;
let numCorrect = 0;

class App extends Component {

  state = {
    values: [value1: 42, value2: 35, value3: 48],
    proposedAnswer: 125,
    numQuestions: 0,
    numCorrect: 0
  }


   handleClick = (event) => {
     event.preventDefault();

    this.setState((prevState)=> {

      if ((prevState.proposedAnswer === (this.state.values[0] + this.state.values[1] + this.state.values[2])) && (event.target.innerHTML.toLowerCase() == true )) {

        return {

                values: prevState.values.map((value) => value = Math.floor(Math.random() * 100)),
                proposedAnswer: prevState.proposedAnswer = Math.floor(Math.random() * 3) + this.state.values[0] + this.state.values[1] + this.state.values[2],
                numCorrect: prevState.numCorrect + 1,
                numQuestions: prevState.numQuestions + 1

               }
      }
      else if ((prevState.proposedAnswer === (this.state.values[0] + this.state.values[1] + this.state.values[2])) && (event.target.innerHTML.toLowerCase() == false)) {

        return {

                values: prevState.values.map((value) => value = Math.floor(Math.random() * 100)),
                proposedAnswer: prevState.proposedAnswer = Math.floor(Math.random() * 3) + this.state.values[0] + this.state.values[1] + this.state.values[2],
                numCorrect: prevState.numCorrect + 1,
                numQuestions: prevState.numQuestions + 1

               }

      }
      else {
        return {
                values: prevState.values.map((value) => value = Math.floor(Math.random() * 100)),
                proposedAnswer: prevState.proposedAnswer = Math.floor(Math.random() * 3) + this.state.values[0] + this.state.values[1] + this.state.values[2],
                numQuestions: prevState.numQuestions + 1

               }

      }


    })
    console.log(this.state.values[1]);

    const reducer = (accumulator, currentValue) => accumulator + currentValue;
    console.log(this.state.values.reduce(reducer));
    console.log(event.target.innerHTML.toLowerCase());

  }



  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">ReactND - Coding Practice</h1>
        </header>
        <div className="game">
          <h2>Mental Math</h2>
          <div className="equation">
            <p className="text">
            {`${this.state.values[0]} + ${this.state.values[1]} + ${this.state.values[2]} = ${this.state.proposedAnswer}`}</p>
          </div>
          <button onClick={this.handleClick}>True</button>
          <button onClick={this.handleClick}>False</button>
          <p className="text">
            Your Score: {this.state.numCorrect}/{this.state.numQuestions}
          </p>
			<p>{this.state.value1}</p>
        </div>
      </div>
    );
  }
}

export default App;