1. 组合 label

<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<!-- import CSS -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head> <body>
<div id="app">
<el-select v-model="options[0].value" placeholder="请选择">
<!-- <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
<template slot-scope></template>
</el-option> -->
<el-option v-for="(item,index) in options" :key="index" :label="`${item.label}-${item.value}`" :value="item.value">
<!-- <template slot-scope></template> -->
</el-option>
</el-select>
</div>
</body>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
new Vue({
el: '#app',
data: function () {
return {
options: [{
value: '1556445455525',
label: 'afsdsdsiosiodidsu',
num:'选项1'
}, {
value: '2556445455525',
label: 'bfsdsdsiosiodidsu',
num:'选项2'
}, {
value: '3556445455525',
label: 'cfsdsdsiosiodidsu',
num:'选项3'
}],
value: ''
}
}
})
</script> </html>

element-ui select的更多相关文章

  1. 使用 Element UI Select 组件的 value-key 属性,让绑定值可以为一个对象

    EsunR 2019-11-07 12:14:42  12264  收藏 6 分类专栏: Vue 文章标签: element-ui 版权 当我们使用 Elemet UI 的选择组件进行多选时,Sele ...

  2. element UI select 设定默认值

    要为select设定默认值,有两个步骤 1.数据中,声明一个变量param:该变量的值设为你想设定的select option中value 2.控件的 v-model 绑定 param 即可 < ...

  3. element ui select组件和table做分页完整功能和二级联动效果

    <template> <div class="index_box"> <div class="search_box"> &l ...

  4. Element ui select 同时获取value和label的值

    html <el-form-item label="单位名称" prop="checkInUnitName"> <el-select v-mo ...

  5. Element ui select同时获取value和label的值

    代码如下: <el-form-item v-if="isMD" label="业务员名称"> <el-select v-model=" ...

  6. shit element ui

    shit element ui element ui & select change event demo https://element.eleme.io/#/en-US/component ...

  7. vue+element ui项目总结点(一)select、Cascader级联选择器、encodeURI、decodeURI转码解码、mockjs用法、路由懒加载三种方式

    不多说上代码: <template> <div class="hello"> <h1>{{ msg }}</h1> <p> ...

  8. 关于Element UI中select组件中遇到的问题

    问题一:在使用select组件设置多选功能后,窗口抖动问题? 详细描述:在我使用select做多选的功能时出现了窗口抖动的问题,测试的时候发现,在有些人的电脑上抖动,有些人的电脑上不抖,找了很多文档, ...

  9. vue+element ui中select组件选择失效问题原因与解决方法

    codejing 2020-07-10 09:13:31  652  收藏 分类专栏: Web Vue Element UI 版权 .当表单form赋完值后,如果后续又对form中某一属性值进行操作如 ...

  10. element UI table 过滤 筛选问题

    一.问提描述    使用elementUI table 官方筛选案例,发现筛选不是服务器端筛选,而是浏览器端对每一页进行单独筛选. 如何在服务器端筛选? 二.查询Element UI 官网table组 ...

随机推荐

  1. thinkphp5的控制器调用自身模块和调用其他模块的方法

    以user为例,调用user.php的get_number()方法 一.不管是调用自身模块还是其他模块app\model\User.php写法不变 <?php namespace app\ind ...

  2. numpy基本方法总结

    NumPy基本方法 一.数组方法 创建数组:arange()创建一维数组:array()创建一维或多维数组,其参数是类似于数组的对象,如列表等 读取数组元素:如a[0],a[0,0] 数组变形:如b= ...

  3. 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_5-1.数据信息安全--微信授权一键登录功能介绍

    笔记 1.数据信息安全--微信授权一键登录功能介绍 简介:讲解登录方式优缺点和微信授权一键登录功能介绍         1.手机号或者邮箱注册             优点:              ...

  4. Docker容器时间与主机时间相差8小时

    查看主机时间 [root@localhost ~]# date 2016年 07月 27日 星期三 22:42:44 CST 查看容器时间 root@b43340ecf5ef:/# date Wed ...

  5. k8s创建资源的两种方式(5)

    一.创建方式分类: 命令 vs 配置文件 Kubernetes 支持两种方式创建资源: 1.用 kubectl 命令直接创建,比如: kubectl run httpd-app --image=reg ...

  6. 树莓派-Ubuntu Mate开启远程桌面xrdp服务

    树莓派3B+安装Ubuntu Mate后,开启远程桌面xrdp服务可以使用KRDC或mstsc远程登录访问,感觉比vnc要快一些: $ sudo apt install xrdp 安装后重启xrdp服 ...

  7. weblogic12.1.3部署应用程序

    weblogic12.1.3部署应用程序请参照:https://www.cnblogs.com/xdp-gacl/p/4143413.html

  8. sudo: unable to execute ./xxx.py: no such file or directory

    $ ./mk_dataset.py -bash: ./mk_dataset.py: /home/ocean1101/anaconda3/bin/python^M: bad interpreter: N ...

  9. koa2中间件

    在我看来,前端框架的中间件的思想来源于传统后端的切面编程(AOP)思想,比如我们常见的身份校验(JWT). axios的拦截器也是基于这种程序设计模式的. 在koa中,实际上是由一个数组对象来保存所有 ...

  10. spring-boot集成6:集成redis实现字典缓存功能

    Why redis? redis是基于内存的key-value系统,可以用作缓存中间件或者消息中间件,spring-boot提供了方便的方式和redis集成. 1.maven依赖 <!--red ...