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组 ...
随机推荐
- 小D课堂 - 新版本微服务springcloud+Docker教程_6-01 微服务网关介绍和使用场景
笔记 第六章 微服务网关zuul开发实战 1.微服务网关介绍和使用场景 简介:讲解网关的作用和使用场景 (画图) 1)什么是网关 API Gateway,是系 ...
- 小D课堂 - 新版本微服务springcloud+Docker教程_5-05熔断降级服务异常报警通知
笔记 5.熔断降级服务异常报警通知实战 简介:完善服务熔断处理,报警机制完善 1.加入redis依赖 <dependency> <gr ...
- WebSocket 搭建简单聊天网站
HTML5 WebSocket WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议. 在WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏 ...
- SafeVarargs的用法
转载自:http://softlab.sdut.edu.cn/blog/subaochen/2017/04/safevarargs%E7%9A%84%E7%94%A8%E6%B3%95/ @SafeV ...
- sql绕过转义符注入
宽字节绕过总结 1. 重点:转义符反斜杠\,ASCII码0x5C 2. 在双字节字符集中, 在\前面增加高字节,0x5C被当做低字节,组合为“汉字”,导致\符号被“吃掉”,后续字符逃出限制,从而绕 ...
- USACO4.4 Shuttle Puzzle【bfs+优化】
直接上$bfs$,每一个状态记录下当前字符串的样子,空格的位置,和走到这个状态的答案. 用空格的位置转移,只有$50pts$ 考虑到题目一个性质:$W$只往右走,$B$只往左走,就可以过了. #inc ...
- ERNIE学习笔记
https://ai.baidu.com/forum/topic/show/954092 学习ERNIE的输入部分 输入 一共有五个部分组成,每个部分之间用分号;隔开: · token_ids:输入句 ...
- 2019牛客暑期多校训练营(第四场)- J free
题目链接:https://ac.nowcoder.com/acm/contest/884/J 题意:给定一个无向图,有n个点,m条边(n,m<=1e3),起点S.终点T,在可以将k条边的权值变为 ...
- [校内模拟赛T3]火花灿灿_二分答案_组合数学_贪心
火花灿灿 题目: 数据范围: 题解: 这个题真的是个神仙题. 我们对于每块石头维护一个$01$串. 这个$01$串的长度是操作次数. 如果$01$串的当前位是$1$,表示这次操作中当前石子被划分到了贡 ...
- 【转帖】赤壁之战,曹操大败只因缺了Service Mesh
赤壁之战,曹操大败只因缺了Service Mesh 本文作者把微服务向 Service Mesh 的进化融入到了三国故事中,妙趣横生.故事比较长,大家慢慢看,精彩的在后边. http://develo ...