Question 245324 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – I'm not able to find the missing semicolon in the following code can anyone please help me out for this?

due to missing semicolon render method I’m not able get desired output

render () {
    return (
        <div className="frame">
            <CalculatorTitle value="My Calculator" />
            <div className="mainCalc">
            <OutputScreen question={this.state.question} answer={this.state.answer} />
                <div className="button-row">
                    <Button label={"Clear"} handleClick={this.handleClick} />
                    <Button label={"Delete"} handleClick={this.handleClick} />
                    <Button label={"."} handleClick={this.handleClick} />
                    <Button label={"/"} handleClick={this.handleClick} />
                </div>
                <div className="button-row">
                    <Button label={"7"} handleClick={this.handleClick} />
                    <Button label={"8"} handleClick={this.handleClick} />
                    <Button label={"9"} handleClick={this.handleClick} />
                    <Button label={"*"} handleClick={this.handleClick} />
                </div>
                <div className="button-row">
                    <Button label={"4"} handleClick={this.handleClick} />
                    <Button label={"5"} handleClick={this.handleClick} />
                    <Button label={"6"} handleClick={this.handleClick} />
                    <Button label={"-"} handleClick={this.handleClick} />
                </div>
                <div className="button-row">
                    <Button label={"1"} handleClick={this.handleClick} />
                    <Button label={"2"} handleClick={this.handleClick} />
                    <Button label={"3"} handleClick={this.handleClick} />
                    <Button label={"+"} handleClick={this.handleClick} />
                </div>
                <div className="button-row">
                    <Button label={"0"} handleClick={this.handleClick} />
                    <Button label={"="} handleClick={this.handleClick} />
                </div>
            </div>
        </div>
    );
}
Tags:

2

Answers


  1. 0

    Try addding a parent element to the buttons like this

    <>
  <Button ...../>
<Button ..../>
  </>
    Login or Signup to reply.
  2. 0

    I think your problem might be that you are only allowed to return one parent element, not that you’re missing a semicolon.

    What happens if you try it like this?

    render() {
  return (
    <div>
      <Button label={"Clear"} handleClick={this.handleClick} />
      <Button label={"Delete"} handleClick={this.handleClick} />
      <Button label={"."} handleClick={this.handleClick} />
      <Button label={"/"} handleClick={this.handleClick} />
      <Button label={"7"} handleClick={this.handleClick} />
      <Button label={"8"} handleClick={this.handleClick} />
      <Button label={"9"} handleClick={this.handleClick} />
      <Button label={"*"} handleClick={this.handleClick} />
      <Button label={"4"} handleClick={this.handleClick} />
      <Button label={"5"} handleClick={this.handleClick} />
      <Button label={"6"} handleClick={this.handleClick} />
      <Button label={"-"} handleClick={this.handleClick} />
      <Button label={"1"} handleClick={this.handleClick} />
      <Button label={"2"} handleClick={this.handleClick} />
      <Button label={"3"} handleClick={this.handleClick} />
      <Button label={"+"} handleClick={this.handleClick} />
      <Button label={"0"} handleClick={this.handleClick} />
      <Button label={"="} handleClick={this.handleClick} />
    </div>
  );
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search