案例演示:获取select当前选中的所有内容

 <el-select v-model="value8" filterable placeholder="请选择" value-key="id" @change="currentSel">
<el-option v-for="item in options" :key="item.id" :label="item.label" :value="item"></el-option>
</el-select>
       options: [
{
value: "选项1",
id: 1,
code: "xuanxiang1",
label: "黄金糕"
},
{
code: "xuanxiang2",
id: 2,
value: "选项2",
label: "双皮奶"
},
{
id: 3,
value: "选项3",
code: "xuanxiang3",
label: "蚵仔煎"
},
{
value: "选项4",
id: 4,
code: "xuanxiang4",
label: "龙须面"
},
{
value: "选项5",
label: "北京烤鸭",
id: 5,
code: "xuanxiang5"
}
],
 currentSel(selVal) {
this.code = selVal.code;
this.name = selVal.label;
console.log("选择的name为:" + this.name, "选择的code为:" + this.code);
console.log(selVal);
},

若有不明白请加群号:复制 695182980 ,也可扫码,希望能帮助到大家。

Vue+Element+Select获取选中的对象的更多相关文章

  1. vue操作select获取option值

    如何实时的获取你选中的值 只用@change件事 @change="changeProduct($event)" 动态传递参数 vue操作select获取option的ID值 如果 ...

  2. select获取选中的option(包含value和text,重点是text怎么获取)

    简单描述:后台需要获取到select标签选择的内容,也就是text,该怎么取呢?很简单. 代码: //hml代码<div class="col-md-6"> <l ...

  3. JQuery/JS select标签动态设置选中值、设置禁止选择 button按钮禁止点击 select获取选中值

    //**1.设置选中值:(根据索引确定选中值)**// var osel=document.getElementById("selID"); //得到select的ID var o ...

  4. vue element select多选回显

    我们经常在使用 Element组件里面的 select多选 场景:添加账号的时候需要选择可见分公司(分公司为多选),添加成功之后可以编辑,需要回显添加时所提交的分公司 代码如下: 多选框: data( ...

  5. 使用layui框架的select获取选中的值

    在使用时需要注意:select标签的外层需要加上类名".layui-form" 接下来就是根据需求来改变下拉框的内容了,直接给select的option重新赋一次值,记得加上对应的 ...

  6. select获取选中项的值与文本

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. select 获取选中option的值方法,选中option方法

    options=$("#Select option:selected"); options.attr('name');options.val(); options.text(); ...

  8. 获取select标签选中状态 的label的值。

    <select name="procode" onchange="alert(this.options[this.selectedIndex].text)" ...

  9. 使用JavaScript获取select元素选中的value和text

    示例代码如下(js直接写在了html里面,没有写在一个单独的外部文件中): <!DOCTYPE html> <html> <head> <meta name= ...

随机推荐

  1. Python之socketserver

    import threading from socketserver import ThreadingTCPServer,BaseRequestHandler import sys import lo ...

  2. 303. Range Sum Query - Immutable(动态规划)

    Given an integer array nums, find the sum of the elements between indices i and j (i ≤ j), inclusive ...

  3. 一个spinner控件使用的实例

    布局文件 <?xml version="1.0" encoding="utf-8"?><android.support.constraint. ...

  4. 制作Win10 U盘版移动便携系统

    制作U盘Win10 灌装WIM VHD_OneKey_beta2 把wim导入VHD文件 复制 WIN8USB.VHD boot bootmgr三个文件到U盘 把制作的Win10的VHD文件重命名为 ...

  5. Vfox数据库导出EXCEL,含有备注型子段

    1. 选择菜单“数据”-> “自其他来源”->“来自 Microsoft Query ”. 2. 在出来的“选择数据源” 里面双击第一个选项“<新数据源>”会出来一个“创建新数 ...

  6. HTTP请求中GET和POST的区别

    一.原理区别 一般我们在浏览器输入一个网址访问网站都是GET请求;再FORM表单中,可以通过设置Method指定提交方式为GET或者POST提交方式,默认为GET提交方式. HTTP定义了与服务器交互 ...

  7. Python数据分析Pandas库之熊猫(10分钟二)

    pandas 10分钟教程(二) 重点发法 分组 groupby('列名') groupby(['列名1','列名2',.........]) 分组的步骤 (Splitting) 按照一些规则将数据分 ...

  8. varnish 相关说明

    一.关于Varnish Varnish 是一款高性能且开源的反向代理服务器和 HTTP 加速器,其采用全新的软件体系机构,和现在的硬件体系紧密配合,与传统的 squid 相比,varnish 具有性能 ...

  9. Hibernate的Cascade——级联操作

    在Hibernate中,针对持久化实体的配置文件中有Cascade这样一个属性,顾名思义就是级联,也就是说在操作当 前实体时,针对当前实体的操作会影响到相应配置的关联实体.比如针对当前实体进行保存操作 ...

  10. 利用策略模式实现了同一接口的多个Servicel实现类,如何同时注入Controller

    解决方法如上图,通过给实现类起别名,并在controller中,通过@Qualifier注解获取不同的实现类,之前没有这样写,会出现这样的情况: 通过@autowired注解注入dao层时为空,会报空 ...