Element给Select 选择器设置默认值(如何给el-select组件设置默认值)
七娃博客448人阅读
element官方关于el-select组件的api中并没有直接说明如何设置option的默认值,官方的value / v-model说明是绑定值,这就会给很多新手造成困惑,我想给el-option第二个选中状态,怎么办?
官方文档:https://element.eleme.cn/#/zh-CN/component/select
很明显,我看完了整个官方关于组件的api说明,别没有找到类似html5中slect标签选中option设置默认值selected 的方法。
困扰了我,也有可能我陷入了html5的误区,其实开头说的 v-model 就是设置默认值的答案!由于vue的双向绑定特性,我们切换selcet后选中的值就添加到v-model绑定的值里面,所以答案呼之欲出!
Element给Select 选择器设置默认值
<template> <div class="select"> <el-select v-model="aa"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> </div> </template> <script> export default { name: "select", data() { return { aa:"选项2", //默认值 options: [{ value: '选项1', label: '黄金糕' }, { value: '选项2', label: '双皮奶' }, { value: '选项3', label: '蚵仔煎' }, { value: '选项4', label: '龙须面' }, { value: '选项5', label: '北京烤鸭' }], }; } }; </script>
效果如下:
这样就很容易给select组件设置默认值了,估计是我的脑子没有转明白,又是被一个白痴问题绊倒了!不过实践是学习的最佳途径,多测试一下就可以了。
评论 | 0 条评论
登录之后才可留言,前往登录