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组 ...
随机推荐
- 007-Linux 查看端口
1.使用ss 查看 ss 一般用于转储套接字统计信息.它还可以显示所有类型的套接字统计信息,包括 PACKET.TCP.UDP.DCCP.RAW.Unix 域等. ss -lntpd | grep : ...
- JAVA 基础编程练习题10 【程序 10 自由落体】
10 [程序 10 自由落体] 题目:一球从 100 米高度自由落下,每次落地后反跳回原高度的一半:再落下,求它在 第 10 次落地时, 共经过多少米?第 10 次反弹多高? package cska ...
- 深入解读TCP/IP
虽然大家现在对互联网很熟悉,但是计算机网络的出现比互联网要早很多. 计算机为了联网,就必须规定通信协议,早期的计算机网络,都是由各厂商自己规定一套协议,IBM.Apple和Microsoft都有各自的 ...
- iOS启动图launchImage设置后在启动时无法显示
iOS设置启动图: 会发现运行APP不显示设置好的启动图 解决方法: 卸载之前运行的APP,检查以下配置,将LaunchScreen删除即可. 原因: launchImage 是在没有LaunchSc ...
- GitLab - 代码仓库管理工具GitLab简介
1 - GitLab 基于git的开源的仓库管理系统项目,使用git作为代码管理工具,并在此基础上搭建web服务,拥有与Github类似的功能. 社区版(Community Edition,CE) 企 ...
- rocksdb wiki文档阅读笔记
由于是英文文档,不做笔记过一阵就忘了,现在把关键点记录到这,开发的时候使用. 具体wiki地址:https://github.com/facebook/rocksdb/wiki 1)Column Fa ...
- C#常用处理数据类型转换、数据源转换、数制转换、编码转换相关的扩展
public static class ConvertExtensions { #region 数据类型转换扩展方法 /// <summary> /// object 转换成string ...
- flask的cookies操作
from flask import Flask,request,Response app = Flask(__name__) @app.route('/') def hello_world(): re ...
- idea spring+springmvc+mybatis环境配置整合详解
idea spring+springmvc+mybatis环境配置整合详解 1.配置整合前所需准备的环境: 1.1:jdk1.8 1.2:idea2017.1.5 1.3:Maven 3.5.2 2. ...
- ubuntu 16.04主题美化
目录 numix图标 Flatabulous主题 参考: Unity-tweak-tool插件 numix图标 sudo apt-add-repository ppa:numix/ppa sudo a ...