How to fix "if statements" in "return part" of class component in React Js?

I am new to react. I want to return components on the basis of multiple conditions. But in this code in return section if statements are not working and I'm getting error. How can I fix that?

    render() {
        console.log(this.state.filterField);
        const filteredXpGreater = this.state.peoples.filter(person => {
            return person.randomXp > 3;
        })
        const filteredXpLess = this.state.peoples.filter(person => {
            return person.randomXp <= 3;
        })
        return (
            if (this.state.filterField.includes("Above 3 Years of Experience")) {
                <div className='App'>
                <Filter radioSelected1={this.onRadioSelected1} radioSelected2={this.onRadioSelected2} checkedMale={this.onCheckedMale} checkedFemale={this.onCheckedFemale} />
                <Cardlist data={filteredXpGreater} />
            </div>
            } else if (this.state.filterField.includes("Above 3 Years of Experience") {
                <div className='App'>
                <Filter radioSelected1={this.onRadioSelected1} radioSelected2={this.onRadioSelected2} checkedMale={this.onCheckedMale} checkedFemale={this.onCheckedFemale} />
                <Cardlist data={filteredXpLess} />
            </div>
            } else {
                <div className='App'>
                <Filter radioSelected1={this.onRadioSelected1} radioSelected2={this.onRadioSelected2} checkedMale={this.onCheckedMale} checkedFemale={this.onCheckedFemale} />
                <Cardlist data={this.state.peoples} />
            }
        )
    }
}