Sobes.tech
Junior — Senior

Detect and fix bugs in a React component

livecode

Task condition

Find and fix the errors in the React component below. Pay attention to the incorrect syntax of the click handler and the lack of state initialization, which lead to errors when trying to access event fields.

import React, { Component } from "react";

export default class App extends Component {
    // click handler – saves the event object in state
    handleClick = (e) => {
        this.setState({ lastEvent: e });
    };

    // logs the target element of the last event to the console
    logCurrentEvent = () => {
        console.log(this.state.lastEvent?.target);
    };

    render() {
        return (
            <div>
                <button onClick={this.handleClick}>click me</button>
                <button onClick={this.logCurrentEvent}>log event</button>
            </div>
        );
    }
}