// 修改树形图样式,如果不含有下箭头的块,要变成行内样式
treeChildInline(){
let hasCaretRight = $("#permission_panel").find(".is-leaf");
$.each(hasCaretRight,(index:number,item:any)=>{
let hasChildNodeList= item.closest('.el-tree-node');
item.closest('.el-tree-node').style.display = 'inline-block';
});
},

//由于element-ui,样式设置为不换行,所以要修改称换行处理,否则小屏幕会导致,展示不全,被隐藏了

// 本例#permission_panel仅仅只是增加作用域,防止全局覆盖,只针对想实现的地方处理,如果因为有全局自己修改覆盖,导致失效请用!important,最高级执行覆盖
<style>
#permission_panel .el-tree-node{
white-space: normal;
}
</style>

  

element-ui的树型结构图,带有复选框的,没有子项的,横排展示的更多相关文章

  1. GridPanel列头带有复选框的列

    由于工作需要,封装了ExtJS4,GridPanel列头带有复选框的列, 代码如下: /** * 列头带有复选框的列 * */ Ext.define("org.pine.widget.Che ...

  2. easy ui datagrid 让某行复选框不能选中

    //百度查找出来的 onLoadSuccess: function(data){//加载完毕后获取所有的checkbox遍历             if (data.rows.length > ...

  3. element-ui的树型结构图,半选状态数据给后台后,返回数据带有半选父节点的剔除展示

    // html <h2 class="text-gray">功能权限</h2><el-tree :data="permissionList& ...

  4. jquery Treeview插件的使用及复选框的级联

    本文是对jquery的Treeview插件使用的实例介绍 效果图如下: 文件结构如下:

  5. 关于textjs的tree带复选框的树

    通过查阅一些资料和自己之前了解到的一些相关知识,有时项目中需要用到.话不多说,先看一下效果图: 我写的这人员选择的树,主要是改写了TreePanel,如下代码: ExtendTreePanel.js ...

  6. 学习 TTreeView [16] - 给 TTreeView 添加复选框 (回复 "丁永其" 的问题)

    问题来源: http://www.cnblogs.com/del/archive/2008/05/15/1114450.html#1199402 本例效果图: unit Unit1; interfac ...

  7. MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件

    类似于多层级的角色与权限控制功能,用MVC实现MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件.最近我们的项目中需要用到树型菜单,以前使用WebForm时,树型菜单有微软提供的 ...

  8. WPF:带复选框CheckBox的树TreeView

    最近要用WPF写一个树,同事给了我一个Demo(不知道是从哪里找来的),我基本上就是参照了这个Demo. 先放一下效果图(3棵树): 这个树索要满足的条件是: 父节点.Checked=true时,子节 ...

  9. anime.js 实战:实现一个带有描边动画效果的复选框

    在网页或者是APP的开发中,动画运用得当可以起到锦上添花的作用.正确使用动画,不但可以有助于用户理解交互的作用,还可以大大提高网页应用的魅力和使用体验.并且在现在的网页开发中,动画已经成为了一个设计的 ...

随机推荐

  1. Python学习【第4篇】:元组魔法

    template = "i am {name},age:{age}" v = template.format(**{"name":'xiaoxing',&quo ...

  2. 武装你的WEBAPI-OData资源更新Delta

    本文属于OData系列 目录 武装你的WEBAPI-OData入门 武装你的WEBAPI-OData便捷查询 武装你的WEBAPI-OData分页查询 武装你的WEBAPI-OData资源更新Delt ...

  3. MySQL常用SQL语句1

    -- 创建表 CREATE TABLE USER ( -- id默认每个表都该拥有(非空 不重复) -- (id是每一行的唯一标识) -- 其他字段可能会重复,我们无法依赖其他的字段去确定某一行记录 ...

  4. HDU-4773 Problem of Apollonius (圆的反演)

    参考: https://oi-wiki.org/geometry/inverse/ https://blog.csdn.net/acdreamers/article/details/16966369 ...

  5. CF-559C Gerald and Giant Chess(计数DP)

    给定一个 \(H*W\)的棋盘,棋盘上只有\(N\) 个格子是黑色的,其他格子都是白色的. 在棋盘左上角有一个卒,每一步可以向右或者向下移动一格,并且不能移动到黑色格子中.求这个卒从左上角移动到右下角 ...

  6. 【poj 1061】青蛙的约会(数论--拓展欧几里德 求解同余方程)

    题意:已知2只青蛙的起始位置 a,b 和跳跃一次的距离 m,n,现在它们沿着一条长度为 l 的纬线(圈)向相同方向跳跃.问它们何时能相遇?(好有聊的青蛙 (΄◞ิ౪◟ิ‵) *)永不相遇就输出&quo ...

  7. hdu5489 Removed Interval

    Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others) Total Submission ...

  8. Java 窗口 绘制图形 #1

    写在前面: editplus换成eclipse了 Sketchpad要钱,买不起 自己搞(rua) by emeralddarkness 建立了一个平面直角坐标系 两个变元x,y,参数i 实现了以下功 ...

  9. PowerShell多任务

    代码 foreach ($server in $servers) { $running = @(Get-Job | Where-Object { $_.State -eq 'Running' }) i ...

  10. python之字符串strip、rstrip、lstrip的方法

    1.描述 strip():用于移除字符串头尾指定的字符(默认为空格或换行符)或字符序列 rstrip():用于移除字符串右边指定的字符(默认为空格或换行符)或字符序列 lstrip():用于移除字符串 ...