element-ui select
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的更多相关文章
- 使用 Element UI Select 组件的 value-key 属性,让绑定值可以为一个对象
EsunR 2019-11-07 12:14:42 12264 收藏 6 分类专栏: Vue 文章标签: element-ui 版权 当我们使用 Elemet UI 的选择组件进行多选时,Sele ...
- element UI select 设定默认值
要为select设定默认值,有两个步骤 1.数据中,声明一个变量param:该变量的值设为你想设定的select option中value 2.控件的 v-model 绑定 param 即可 < ...
- element ui select组件和table做分页完整功能和二级联动效果
<template> <div class="index_box"> <div class="search_box"> &l ...
- Element ui select 同时获取value和label的值
html <el-form-item label="单位名称" prop="checkInUnitName"> <el-select v-mo ...
- Element ui select同时获取value和label的值
代码如下: <el-form-item v-if="isMD" label="业务员名称"> <el-select v-model=" ...
- shit element ui
shit element ui element ui & select change event demo https://element.eleme.io/#/en-US/component ...
- vue+element ui项目总结点(一)select、Cascader级联选择器、encodeURI、decodeURI转码解码、mockjs用法、路由懒加载三种方式
不多说上代码: <template> <div class="hello"> <h1>{{ msg }}</h1> <p> ...
- 关于Element UI中select组件中遇到的问题
问题一:在使用select组件设置多选功能后,窗口抖动问题? 详细描述:在我使用select做多选的功能时出现了窗口抖动的问题,测试的时候发现,在有些人的电脑上抖动,有些人的电脑上不抖,找了很多文档, ...
- vue+element ui中select组件选择失效问题原因与解决方法
codejing 2020-07-10 09:13:31 652 收藏 分类专栏: Web Vue Element UI 版权 .当表单form赋完值后,如果后续又对form中某一属性值进行操作如 ...
- element UI table 过滤 筛选问题
一.问提描述 使用elementUI table 官方筛选案例,发现筛选不是服务器端筛选,而是浏览器端对每一页进行单独筛选. 如何在服务器端筛选? 二.查询Element UI 官网table组 ...
随机推荐
- thinkphp5的控制器调用自身模块和调用其他模块的方法
以user为例,调用user.php的get_number()方法 一.不管是调用自身模块还是其他模块app\model\User.php写法不变 <?php namespace app\ind ...
- numpy基本方法总结
NumPy基本方法 一.数组方法 创建数组:arange()创建一维数组:array()创建一维或多维数组,其参数是类似于数组的对象,如列表等 读取数组元素:如a[0],a[0,0] 数组变形:如b= ...
- 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_5-1.数据信息安全--微信授权一键登录功能介绍
笔记 1.数据信息安全--微信授权一键登录功能介绍 简介:讲解登录方式优缺点和微信授权一键登录功能介绍 1.手机号或者邮箱注册 优点: ...
- Docker容器时间与主机时间相差8小时
查看主机时间 [root@localhost ~]# date 2016年 07月 27日 星期三 22:42:44 CST 查看容器时间 root@b43340ecf5ef:/# date Wed ...
- k8s创建资源的两种方式(5)
一.创建方式分类: 命令 vs 配置文件 Kubernetes 支持两种方式创建资源: 1.用 kubectl 命令直接创建,比如: kubectl run httpd-app --image=reg ...
- 树莓派-Ubuntu Mate开启远程桌面xrdp服务
树莓派3B+安装Ubuntu Mate后,开启远程桌面xrdp服务可以使用KRDC或mstsc远程登录访问,感觉比vnc要快一些: $ sudo apt install xrdp 安装后重启xrdp服 ...
- weblogic12.1.3部署应用程序
weblogic12.1.3部署应用程序请参照:https://www.cnblogs.com/xdp-gacl/p/4143413.html
- 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 ...
- koa2中间件
在我看来,前端框架的中间件的思想来源于传统后端的切面编程(AOP)思想,比如我们常见的身份校验(JWT). axios的拦截器也是基于这种程序设计模式的. 在koa中,实际上是由一个数组对象来保存所有 ...
- spring-boot集成6:集成redis实现字典缓存功能
Why redis? redis是基于内存的key-value系统,可以用作缓存中间件或者消息中间件,spring-boot提供了方便的方式和redis集成. 1.maven依赖 <!--red ...