element UI select下拉框数据回显

首先你需要提前查询下拉框所需要的数据:

initItem = [

    {id:1,name:'张三',age:18},

    {id:2,name:'李四',age:18},

    {id:3, name:'王五',age:18},

]

然后从element UIcpoy 一段下拉框的代码:

                <el-select v-model="form.student.id"  placeholder="请选择学生">
                  <el-option
                    v-for="item in roles"
                    :key="item.value"
                    :label="item.name"
                    :value="item.id"					
                  >
                    <span style="float: left">{{ item.name }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.id }}</span>
                  </el-option>
                </el-select>

注意事项 :

el-option 中的 value 的值一定要和 el-select 的v-model是同一类型 

切记不能 el-option 中的 value 的值 是个student ,但是el-select 的v-model是 是个学生的id 这样不会自己选中

而且最好必要自己写v-if 让下拉框选中.麻烦又不灵活

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章