render(){
let { classes } = this.props;
let list = classes.map((item, index) => {
return (
<option >{item}</option>
)
})
return(
<div className="filter-bar">
<form className="sort-form">
<div className="classSelect">
<span>select class</span>
<select name="classSelect" onChange={this.handleClassChange}}>
<option selected="selected" >Please choose class</option>
{list}
</select>
</div>
</form>
</div>
)
}
};
Я хочу сопоставить массив и использовать каждый элемент в качестве параметров в раскрывающемся списке выбора, а также иметь дополнительный пустой параметр, который по умолчанию используется до тех пор, пока не будет нажат раскрывающийся список.
На данный момент в списке доступно то, что у меня есть, но по умолчанию всегда является первым элементом из массива, тогда как я хочу, чтобы по умолчанию было «Пожалуйста, выберите свой класс»
Может кто-нибудь объяснить?
1 ответ
render(){
const classes = [
'Lorem',
'Ipsum',
'dolor',
'Sit',
'ames'
]
let list = classes.map((item, index) => {
return (
<option >{item}</option>
)
})
return(
<div className="filter-bar">
<form className="sort-form">
<div className="classSelect">
<span>select class</span>
<select name="classSelect" onChange={this.handleClassChange.bind(this)}>
<option value="none" selected disabled hidden>
</option>
{list}
</select>
</div>
</form>
</div>
)
Как это?
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript/JS) и его различных диалектах/реализациях (кроме ActionScript). Обратите внимание, что JavaScript — это НЕ Java. Включите все теги, относящиеся к вашему вопросу: например, [node.js], [jQuery], [JSON], [ReactJS], [angular], [ember.js], [vue.js], [typescript], [стройный] и т. д.
valueпараметру по умолчанию и используйте это значение в качестве начального состояния