案例演示:获取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. css画斜线(用于时间的显示)

  2. CentOS7编译安装SVN(subversion1.9.7)

    参考连接0:http://www.programering.com/a/MDMzYDMwATg.html参考连接1:http://www.zsythink.net/archives/13180.系统信 ...

  3. CentOS7 配置ISCSI targetcli 共享存储

  4. Python strip()与lstrip()、rstrip()

    .strip()方法可以根据条件遍历字符串中的字符并一一去除 默认去除字符串中的头尾空格 “  Alins  ”.“  AA  BB  CC  ”用了之后就是 “Alins”.“AA  BB  CC” ...

  5. CCF CSP 201604-1 折点计数

    题目链接:http://118.190.20.162/view.page?gpid=T42 问题描述 试题编号: 201604-1 试题名称: 折点计数 时间限制: 1.0s 内存限制: 256.0M ...

  6. sys模块

    #python run_case.py #在terminal中执行.py文件 在terminal中执行.py文件: 注: 无法使用terminal来打开那个文件 会显示如下:python: can't ...

  7. Java中==和equals方法

    Java程序中测试两个变量是否相等有两种方式:1.== :2.equals()方法 当使用==来判断两个变量是否相等时,如果两个变量是基本类型变量,且都是基本数值类型(不一定要求数据类型严格相同),则 ...

  8. Unity用Excel.dll简单读取Excel内容

    Unity用Excel.dll简单读取Excel内容 需要Excel.dll 需要如下三个命名空间 using System.IO; using Excel; using System.Data; 1 ...

  9. dom节点相关问题

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

  10. EF中防止sql注入

    EF作为一个orm框架,本身以及放置了sql的注入,但是如果我们需要执行sql语句的时候了?比如,我们需要查询视图"select * from VM where 条件 = {0}" ...