<el-select v-model="param.ptpFprojInf.applyType" :disabled="isDisabled"
clearable placeholder="请选择" size="small">
<el-option
v-for="item in applyTypes"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
applyTypes 这个是个数组形式,存放的就是下拉框的内容,只要改变这个数组,自然下拉框的内容也就变了啊
选择你要设置的单元格,数据--有效性,弹出“数据有效性”对话框--设置,“有效性条件”中“允许”选择“序列”,在“来源”处输入你想要在下拉列表中显示的“默认值”,两个值之间用英文状态下的逗号隔开,确定即可(也可引用一些单元格的数据为“默认值”)。实际项目中我们获取选择的数据的id;这时候需要配合使用v-bind,才能获取到选择的那条数据的id值,其实就是id赋值给value属性
<template>
<div>
<select
v-model="select"
>
<option
v-for="(a,index)
in
arr"
:key="index"
:value="a.id">{{
a.name
}}</option>
</select>
<p>您选择的名字的Id是:{{select}}</p>
</div>
</template>
js代码
<script>
export
default
{
data(){
return{
select:'',
arr:[
{id:'1',name:'html'},
{id:'2',name:'css'},
{id:'3',name:'js'},
]
}
}
}
</script>
拓展知识:vue获取id以及重定向路由方法
1.获取ID的方法:
let
orderId=this.$route.query.id
2.路由重定向方法
this.$router.push(this.$route.query.redirect
||
'/login')
以上这篇vue操作下拉选择器获取选择的数据的id方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
您可能感兴趣的文章:Vue.js获取被选择的option的value和text值方法vue如何通过id从列表页跳转到对应的详情页vue实现在表格里,取每行的id的方法