115
rated 0 times
[
117]
[
2]
/ answers: 1 / hits: 27221
/ 6 Years ago, tue, november 13, 2018, 12:00:00
I have array of cities with objects like this:
[{id: 1, name: 'New York'}, {id: 2, name: 'London'} ...]
and I have a value of id.
I put elements (names) from array to select list. But I need to add first option with value from array (name) which have the corresponding id which I can't make it work.
My component:
const propTypes = {
cities: PropTypes.array,
enteredEvent: PropTypes.array
};
class newEvent extends Component {
constructor(props) {
super(props);
this.state = {
showInOption: ''
};
this.handleDictionary = this.handleDictionary.bind(this);
this.searchTypeEvent = this.searchTypeEvent.bind(this);
}
componentDidMount() {
this.searchTypeEvent();
}
handleDictionary(e) {
...
}
searchTypeEvent() {
if (this.props.enteredEvent.cityid !== null && this.props.enteredEvent.cityid !== undefined) { // if I have id value
const type = this.props.cities.find(el => el.id === this.props.enteredEvent.cityid); // find an object with id
this.setState({ showInOption: type.name });
}
this.setState({ showInOption: 'Select something' });
}
render() {
return (
<div>
<select onChange={this.handleDictionary}>
<option>{this.state.showInOption}</option> // here I need to add a value
{this.props.cities.map(item => { // here I call other options
return (<InputSelect key={item.id} directory={item}/>);
})}
</select>
</div>
);
}
}
I have an error:
Uncaught TypeError: Cannot read property 'name' of undefined
How can I fix it?
More From » reactjs
