首页 > 编程知识 正文

vueselect选择第一个触发事件,vue中如何使用select标签

时间:2023-05-04 03:24:43 阅读:249855 作者:4109

https://blog.csdn.net/weixin_41056945/article/details/92382436

https://blog.csdn.net/u014717572/article/details/83868192

 option 选项内容写在JS中的,通过v-for来遍历的:

通过v-model可以获取到选中的值,如果option中存在value属性,优先获取value值即coupon.id,如果不存在,则获取option的文本内容,也就是下面代码中coupon.name.

通过绑定、设置ID 获取到相应的值:this.value = JSON.stringify(this.DataList.checkId);(ID绑定为字符串类型)

data:{ couponList:[ { id: 'A', name: '优惠券1' }, { id: '1', name: '优惠券2' }, { id: '2', name: '优惠券3' } ], couponSelected: '',},<!-- 通过绑定、设置ID 获取到相应的值 --><select name="public-choice" v-model="couponSelected" @change="getCouponSelected"> <option :value="coupon.id" v-for="coupon in couponList" >{{coupon.name}}</option> </select>created(){  //如果没有这句代码,select中初始化会是空白的,默认选中就无法实现 this.couponSelected = this.couponList[0].id; //或者在接口中 直接获取到ID this.couponSelected = datas.couponid;}, methods:{  getCouponSelected(){ //获取选中的优惠券 console.log(this.couponSelected) }}

element:

<el-select v-model="value8" filterable placeholder="请选择" value-key="id" @change="getChange"> <el-option v-for="item in options" :key="item.id" :label="item.label" :value="item.id" </el-option><!--:value="item" --></el-select>getChange(val) {console.log(val) //this.code = val.code; //this.name = val.label; //console.log("选择的name为:" + this.name, "选择的code为:" + this.code); //console.log(val);}, 原生: <select name="status" id="status" v-model="selected"> <option value="">请选择</option> <option value="1">未处理</option> <option value="2">处理中</option> <option value="3">处理完成</option></select>data(){ rerurn { selectvalue: "", searchoptions: [ { ID: "1", VersionNames: "ssdwl" }, { ID: "2", VersionNames: "双皮奶" } ], }} <select class="select_appname" v-model="selectvalue"> <option v-for="(item,index) in selectoptions" :key="index" :value="item.ID" >{{item.VersionNames}}</option></select>this.selectvalue = datas.VersionNameID;

 

json文件有什么作用网络编程(四) ———— UDP首部格式性能测试 Kafka消息队列 UKafkaQiankun JS沙箱是怎么做隔离的

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。