Долго не мог понять почему не проходят пункты 16, 18, 20 (хотя на мой взгляд я все дела правильно).
Изначально у меня был такой код
import React from 'react';
import AgeCheckBox from './AgeCheckBox';
class App extends React.Component {
state = {
selectedAgeGroup: undefined
};
handleClick = (e) => {
this.setState({selectedAgeGroup: e.target.id});
};
handleSome = () => {
return this.state.selectedAgeGroup === "18-25" || this.state.selectedAgeGroup === "26-35" || this.state.selectedAgeGroup === "36-50";
};
render() {
return (
<div>
<h2>What is your age?</h2>
<AgeCheckBox label="18-25" checked={this.handleSome ()} onChange={this.handleClick} />
<AgeCheckBox label="26-35" checked={this.handleSome ()} onChange={this.handleClick} />
<AgeCheckBox label="36-50" checked={this.handleSome ()} onChange={this.handleClick} />
</div>
);
}
}
export default App;
Пытался и так и сяк менять местами код (так как знаю, что для выполнения условий нужно четкое решение соответствующее заданию). Решение скрывалось в самих условиях задания (если вчитаться в пункты которые не проходили 16, 18, 20, то там прямо указано что нужно сделать).
import React from 'react';
import AgeCheckBox from './AgeCheckBox';
class App extends React.Component {
state = {
selectedAgeGroup: undefined
};
handleClick = (e) => {
this.setState({selectedAgeGroup: e.target.id});
};
render() {
return (
<div>
<h2>What is your age?</h2>
<AgeCheckBox label="18-25" checked={this.state.selectedAgeGroup === "18-25"} onChange={this.handleClick} />
<AgeCheckBox label="26-35" checked={this.state.selectedAgeGroup === "26-35"} onChange={this.handleClick} />
<AgeCheckBox label="36-50" checked={this.state.selectedAgeGroup === "36-50"} onChange={this.handleClick} />
</div>
);
}
}
export default App;
Пишу чтобы помочь другим (или себе если еще раз буду проходить это задание).