i am just learning react using Andrew meed’s course.
what i am getting problem is -> in the keyOption property i am getting last value as ‘undefined’
i don’t know why ?
class Header extends React.Component{
render(){
console.log(this.props);
return (
<div>
<h1>{this.props.title}</h1>
<h2>{this.props.subtitle}</h2>
</div>
);
}
}
class Option extends React.Component{
render(){
console.log(this.props.keyOption);
return (
<div>{this.props.keyOption}</div>
);
}
}
class Options extends React.Component{
render(){
// console.log(this.props)
return (
<div>
{
this.props.option.map((option)=>{
// console.log(option);
return <Option key={option} keyOption={option} />;
})
}
<Option />
<button>what should i do?</button>
</div>
);
}
}
class IndecisionApp extends React.Component{
render(){
const subtitle="this is subtitle";
const option = ["first","second","third"];
return (
<div>
<Header title="Indecision App" subtitle={subtitle} />
<h1>take it </h1>
<p>how are you</p>
<Options option={option}/>
</div>
);
}
}
ReactDOM.render(<IndecisionApp />,document.getElementById('app'));