element-ui中table组件的表格嵌套Select,table中使用select
在table组件中,有一个<template slot-scope="scope"></template>,这个模板有一个slot-scope属性,这个属性的作用,等同于我们在给每个组件写CSS的时候,都会加上scoped的作用是一样的。也就是说,使用这样的一个模板,就能够让每一个下拉框都是独立的互不干扰的,但是我们需要做一些相应的改变。
不加这个属性,选项选不中
<el-table-column label="暂降原因" align="center">
<el-table-column>
<template slot-scope="scope">
<el-select v-model="bb" placeholder="暂降原因" style="width:110px" class="input-class">
<el-option label="短路故障" value="短路故障" />
<el-option label="变压器激磁" value="变压器激磁" />
<el-option label="电机启动" value="电机启动" />
<el-option label="不明原因" value="不明原因" />
</el-select>
</template>
</el-table-column>
</el-table-column>
element-ui中table组件的表格嵌套Select,table中使用select的更多相关文章
- vue问题三:element ui的upload组件上传图片成功和移除事件
element ui的upload组件上传图片成功和移除事件: 登录后获取到后台传的token存到中: sessionStorage.setItem("token",data.ob ...
- vue + element ui 实现实现动态渲染表格
前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...
- Vue+element UI实现分页组件
介绍 这是一个是基于element-UI的分页组件基础上,进行了二次封装的分页组件,在展示数据时,该分页组件采用了每显示一页数据,只请求当前页面的数据的请求策略,从而避免了一次性将数据全部请求所造成的 ...
- 使用element-ui 的table 组件 出现表格线条不对齐的问题
在全局css样式中添加以下代码即可: body .el-table th.gutter { display: table-cell !important }
- element ui 弹出组件的遮罩层在弹出层的上面的解决方法
<el-dialog title="收货地址" :visible.sync="dialogFormVisible" :modal-append-to-bo ...
- 封装一个优雅的element ui表格组件
现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开.虽然element ui的table组件很好.但是表格和分页是分离的.每次写表 ...
- element ui step组件在另一侧加时间轴显示
这是我开发的时候遇到的一个问题:项目需要在步骤条(竖直方向)的另一侧加时间显示,但是我在element ui 的step组件中一直没找着设置方法,所以就自己想了个办法加进来,效果如下: 代码如下,先上 ...
- element UI排坑记(一):判断tabs组件是否切换
之所以将这个问题列在排坑记之中,是因为官方组件的一个属性颇有些隐蔽,这个问题曾经折腾了本人较多时间,始终思维固着,且使用搜索引擎也不容易搜索到答案,故记之.然而实际解决却是相当简单的. 一.问题描述 ...
- Table 组件构建过程中遇到的问题与解决思路
在 GearCase 开源项目构建 Table 组件的过程中.遇到了各式各样的问题,最后尝试了各种方法去解决这些问题. 遇到的部分问题 checkbox 的全选和半选问题 table 组件的排序请求方 ...
随机推荐
- LeetCode - 统计数组中的元素
1. 统计数组中元素总结 1.1 统计元素出现的次数 为了统计元素出现的次数,我们肯定需要一个map来记录每个数组以及对应数字出现的频次.这里map的选择比较有讲究: 如果数据的范围有限制,如:只有小 ...
- [题解] LOJ 3300 洛谷 P6620 [省选联考 2020 A 卷] 组合数问题 数学,第二类斯特林数,下降幂
题目 题目里要求的是: \[\sum_{k=0}^n f(k) \times X^k \times \binom nk \] 这里面出现了给定的多项式,还有组合数,这种题目的套路就是先把给定的普通多项 ...
- Morris 遍历实现二叉树的遍历
Morris 遍历实现二叉树的遍历 作者:Grey 原文地址: 博客园:Morris 遍历实现二叉树的遍历 CSDN:Morris 遍历实现二叉树的遍历 说明 Morris 遍历可以实现二叉树的先,中 ...
- 我要手撕mybatis源码
传统的JDBC编程中的一般操作: 1.注册数据库驱动类,指定数据库的URL地址.数据库用户名.密码等连接信息 2.通过DriverManager打开数据库连接 3.通过数据库连接创建Statement ...
- Django之同时新增数据到两个数据库表与同时返回两个表的数据(插拔式)
models:比如有以下三个模型 from django.db import models """ 基类,其他类继承即可获得对应的字段 """ ...
- ansible使用临时命令通过模块来执行任务
使用临时命令通过模块来执行任务 一.查看系统上安装的所有模块 ansible-doc -l 查看ping模块帮助文档 ansible-doc ping 1.ansible模块 文件模块: copy:将 ...
- Docker之介绍与安装
Docker 说明 本章,我们主要从Docker简介.Docker中几个核心概念和Docker安装这几个方面对Docker进行介绍! 1. Docker 简介 1.1. 什么是 Docker Dock ...
- Python基础指面向对象:2、动静态方法
面向对象 一.动静态方法 在类中定义的函数有多种特性 1.直接在类中定义函数 再类中直接定义函数,默认绑定给对象,类调用时有几个参数就要传几个参数,对象调用时该函数的第一个参数默认为对象 # 定义 ...
- python 队列(QUEUE)
QUEUE python中多线程编程的数据结构 基本FIFO队列 class Queue.Queue(maxsize=0) 先进先出,maxsize为队列中能存放的数据个数上限. import Que ...
- SpringCloud(九) - Nginx
1.安装Nginx 1.1 解压上传安装包 解压# nginx-1.16.1.tar.gz # nginx需要一些环境(全部执行,不存在的会执行,存在的会跳过) yum install -y wget ...