Question

我有一些数据作为道具传递，我希望它成为我的默认选择值。这是我正在使用的材料ui中用于选择的代码。但是用户也应该可以选择其他课程。父级传递的道具是课程名称，可以用作this.props.coursename

<form className={classes.root} autoComplete="off">
                   <FormControl className={classes.formControl}>
                   <InputLabel htmlFor="age-simple">Courses</InputLabel>
                  <Select
                     value={this.state.courseselected}
                     onChange={this.handleCourseChange}
                     inputProps={{
                        name: "courseselected",
                        id: "age-simple"
                    }}
                >

                 {CourseData.map(item => {
               return <MenuItem value={item._id}>{item.title}</MenuItem>;
             })}
           </Select>
         </FormControl>
       </form>

我正在传递props父组件，并且我希望该课程默认显示为选定。

Answer 1

您必须已经在构造函数或类级别的状态下初始化了courseSelected

在构造函数级别

    constructor(props){
         super(props){
         this.state = {
              courseSelected: “”
         }
     }

或者在课堂上

    state = {
         courseSelected: “”
    }

因此要在下拉列表中显示默认值

只是改变

   courseSelected: “”

收件人

   courseSelected: this.props.coursename

在选择材料ui

1 个答案: