renderAction is not defined? - src/Components/Track/Track.js

Hi there, I posted some pictures that present my problem.

But I can also explain here. I tried to follow the developers video to the tea (meaning very accurately) and unfortunately, I get this compiling issue that the renderAction method in track.js is not defined. but I thought I defined this in the above render method just below the class syntax.

I’m a little confused by this error and how to resolve it… I tried to search online but the answers I found related to having the proper class syntax such as class {component name} extends React.Component etc.

I’m not sure how to resolve this , could someone help me please and thank you in advanced!

`import React from 'react';

import './Track.css';


class Track extends React.Component {

    renderAction() {
        if (this.props.isRemoval) {
            return <button className="Track-action">-</button>
        } else {
            return <button className="Track-action">+</button>
        } 
    } 

    render() {
        return (
            <div className="Track">
                <div className="Track-information">
                    <h3>{this.props.track.name}</h3>
                    <p>{this.props.track.artist} | {this.props.track.album}</p>
                </div>
               {renderAction()}
                {/*Added a dynamic button that displays a negative or a positive based on the value of the prop isRemoval that will be passed down to this component*/}
            </div>
        )
    }
}

export default Track;
1 Like