![](https://img-blog.csdnimg.cn/20200801113403308.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
element组件使用集锦
文章平均质量分 74
使用饿了么碰到的一些冷门样式、用法的汇总,持续更新
QWJ-JIE
前端随笔。。
展开
-
el-table-column的label属性(表头)分两行展示
el-table-column的label属性(表头)分两行1.自定义节点内容:render-contentel-table-column标签中添加: :render-header="renderHeader"2.添加两个方法renderHeader(h, {column}) { let header = column.label.split(' '); return [h('p', [ h('p', {}, header[0]), h('span', {}, header[1])原创 2020-12-16 16:33:05 · 5349 阅读 · 0 评论 -
el-cascader点击label勾选
原有功能的基础上额外加!//el-cascader里额外加:@click.native="handleSelect" //label点击事件:popper-class="'cascader1'" //防止多个联级选择器重复//方法额外加handleSelect(event) { var that = this; this.$nextTick(() => { let d = document.getElementsByClassName("cascader1");原创 2020-12-16 16:22:32 · 1307 阅读 · 0 评论 -
el-tree实现横向排列
el-tree部分按钮横向排列1.自定义节点内容:render-contentel-tree标签中添加: :render-content="renderContent"2.添加两个方法renderContent(h, { node, data }) { console.log(node, data) let classname = '' //1-导航;2-菜单;3-按钮 if (data.type == 3) { classname = 'levelname' } return原创 2020-12-16 16:21:05 · 3084 阅读 · 0 评论 -
el-table selection多选框实现单选效果
需求:将默认的可全选改为只能单选1.隐藏全选<style lang="scss" scoped> // /deep/ !important thead .el-table-column--selection .cell { display: none!important; }</style>2.<el-table ref="multipleT...原创 2020-08-01 11:40:33 · 2251 阅读 · 1 评论 -
element之给table表头的添加红色星号
测试下// An highlighted blockvar foo = 'bar';原创 2020-08-01 11:36:24 · 3964 阅读 · 1 评论