vue结合element实现下拉列表选择之后显示

最新推荐文章于 2024-08-01 14:22:09 发布

_陌子曦

最新推荐文章于 2024-08-01 14:22:09 发布

阅读量8.7k

点赞数 1

分类专栏： vue 文章标签： vue

本文链接：https://blog.csdn.net/QCIWYY/article/details/81669378

版权

vue 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文基于element组件

下拉列表

<el-form-item label="部门">
			    <el-select v-model="department" placeholder="请选择" style="width:695px;">
			    <el-option style="height:50px;" v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
			  </el-select>
            </el-form-item>

js代码

var vm = new Vue({
　　el: '#app',
　　data:{
　　　　options: [{
			          value: '0',
			          label: '设计部'
			        }, {
			          value: '1',
			          label: '研发部'
			        }],
			    department: '',
　　},
　　created(){
　　　　//如果没有这句代码，select中初始化会是空白的，默认选中就无法实现
　　　　this.department = this.couponList[0].name;

　　},
methods:{

　　　　getCouponSelected(){

　　　　　　//获取选中的优惠券
　　　　　　console.log(this.couponSelected)
　　　　}

　　}
})

参考博客：http://www.cnblogs.com/CMing/p/9229060.html