vue实现 select 下拉框点击选项触发事件

 

注意不要使用 @click 点击事件会不生效，使用 @click.native

 

 

 

获取option的ID值

1.html部分

?

<select  class="bw1 bss bc4 h40px w100 dib br4 fl" v-model="ProductActive"  @change="changeProduct($event)" >

       <option value="0">商品名称</option> 

       <option v-for="(item,index) in productList" :key="index"  :value='item.id'>{{item.title}}</option> 

</select> 

　　

2.javascript部分

?

<script>

    export default {

        data() {

            return {

                ProductActive: 0, //商品名称当前选中项

                productList: [],

            }

 

        },

        methods: {

            changeProduct(event) {

                this.ProductActive = event.target.value; //获取商品ID，即option对应的ID值

            },

        }

    }

</script>