使用@change监听事件实时获取option值

<div id="app">
	<select v-model="currentId" @change="change($event)">
    	<option v-for="(item,index) in productList" :key="index" :value="item.id" v-text="item.val"></option>  
	</select>  
</div>
	var vue = new Vue({
		el:'#app',
		data:{
        	productList:[
        		{id:1,val:"红茶"},
        		{id:2,val:"绿茶"},
        		{id:3,val:"茉莉花茶"},
        		{id:4,val:"龙井"}
        	],
        	currentId:"1",//获取被选中的value值, 默认选中的是1
     	},
                
  		methods: {
           	change(event) {
           		var _this = this
             	this.currentId = event.target.value; //获取option对应的value值
             	console.log("你的选择是"+this.currentId)
           	},
       	}
	})

 

Logo

前往低代码交流专区

更多推荐