需求

把select改为selectTree,后台给的数据也进行了改造,数据里面多了children字段,包裹子集

代码

  1. //import
  2.  
  3. import { Row , Col , Select , Button , Card ,Tooltip , Icon , TreeSelect } from 'antd'
  4. const { TreeNode } = TreeSelect;

  

  1. //render 定义 loop
  2.  
  3. //获取树状结构数据
  4. const loop = skillGroupList =>
  5. skillGroupList.map(item => {
  6. if (item.children && item.children.length) {
  7. return (
  8. <TreeNode key={item.id} title={item.name} value={item.skillGroupId}>
  9. {loop(item.children)}
  10. </TreeNode>
  11. );
  12. }
  13. return <TreeNode key={item.id} title={item.name} value={item.skillGroupId}/>;
  14. });
  15. const treeNodeList = loop(skillGroupList);

  

  1. select改为selectTree——antd
  2.  
  3. <TreeSelect
  4. style={{ width: 300 }}
  5. defaultValue={intl('route_Monitor_skillName',true)}
  6. dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
  7. placeholder="请选择技能组"
  8. allowClear
  9. treeDefaultExpandAll
  10. onChange={this.skillGroupChange}
  11. >
  12. {treeNodeList}
  13. </TreeSelect>

  

selectTree 改造的更多相关文章

  1. MIP改造常见问题二十问

    在MIP推出后,我们收到了很多站长的疑问和顾虑.我们将所有疑问和顾虑归纳为以下二十个问题,希望对大家理解 MIP 有帮助. 1.MIP 化后对其他搜索引擎抓取收录以及 SEO 的影响如何? 答:在原页 ...

  2. Nodejs之MEAN栈开发(五)---- Angular入门与页面改造

    这个系列一共会涉及两个JavaScript框架的讲解,一个是Express用做后端,一个是Angular用于前端.和Express一样,Angular分离内容,处理视图.数据和逻辑.和MVC模式很相似 ...

  3. 使用图片视频展示插件blueimp Gallery改造网站的视频图片展示

    在很多情况下,我们网站可能会展示我们的产品图片.以及教程视频等内容,结合一个比较好的图片.视频展示插件,能够使得我们的站点更加方便使用,也更加酷炫,在Github上有很多相关的处理插件可以找来使用,有 ...

  4. Lightbox改造——支持滚轮缩放

    在做文章类型的web页时,经常会遇到要点开看大图的需求,LightBox2则是在众多产品中比较优秀的一款Jquery插件.配置就不细说了,今天我主要要分享的是:如何在点开大图后,可以通过鼠标滚轮来缩放 ...

  5. 记一次企业级爬虫系统升级改造(二):基于AngleSharp实现的抓取服务

    爬虫系统升级改造正式启动: 在第一篇文章,博主主要介绍了本次改造的爬虫系统的业务背景与全局规划构思: 未来Support云系统,不仅仅是爬虫系统,是集爬取数据.数据建模处理统计分析.支持全文检索资源库 ...

  6. [网站性能1]对.net系统架构改造的一点经验和教训

    文章来源:http://www.admin10000.com/document/2111.html 在互联网行业,基于Unix/Linux的网站系统架构毫无疑问是当今主流的架构解决方案,这不仅仅是因为 ...

  7. Appium 三种wait方法(appium 学习之改造轮子)

    前些日子,配置好了appium测试环境,至于环境怎么搭建,参考:http://www.cnblogs.com/tobecrazy/p/4562199.html   知乎Android客户端登陆:htt ...

  8. mac-改造你的terminal

    今天在知乎上看到了一篇关于<程序员如何优雅使用Mac>,里面介绍了不少Mac的高端使用技巧,其中关于terminal的部分更是深深的吸引了我,于是我也开始了我的terminal改造计划. ...

  9. EF架构~EF异步改造之路~仓储接口的改造

    回到目录 返回异步与并行目录 C#5.0带来了并行编程 {C#1.0托管代码→C#2.0泛型→C#3.0LINQ→C#4.0动态语言→C#5.0异步编程} 随着C#5.0在.net4.5出来之后,它们 ...

随机推荐

  1. Spring Boot教程(三)消费Restful的web服务

    构架工程 创建一个springboot工程,去消费RESTFUL的服务.这个服务是 http:///gturnquist-quoters.cfapps.io/api/random ,它会随机返回Jso ...

  2. 源码阅读-JLRoutes路由设置

    最后更新: 2018-1-20 JLRoutes 是在 github 上 Star 比较多的一个, 在各大平台也有介绍, 一些知识可以参考到下面的连接查看. 本文仅仅作为我的思考以及对应的心得; 一. ...

  3. 20165220课程设计个人报告——Part4-Cortex M4模块

    个人报告: 20165220 葛宇豪 1.个人贡献 a.实验环境搭建 b.代码分析与理解 2.设计中遇到的问题以及解决方案 问题1:mdk5每次编译之前都会直接闪退 刚开始以为是环境问题,后来上网查资 ...

  4. java实现豆瓣回帖机器人

    最近一直帮老板写爬虫,写累了就寻思着找点乐子,碰巧平时喜欢逛豆瓣,就打算写一个自动回帖机器人,废话不多说我们进入正题: 主要用到2个开源工具:Jsoup和httpclient Step 1:模拟登陆 ...

  5. MVC的一个简单实例

    基本思路: 一个Regist.jsp注册页面,用于收集用户信息,发送请求给控制器Servlet:控制器层Servlet封装模型层对象 jBean,并调用其方法regiser实现用户信息的保存:模型层J ...

  6. String2LongUtil

    public class String2LongUtil { /** * String类型转换成date类型 * strTime: 要转换的string类型的时间, * formatType: 要转换 ...

  7. chrome 调试

    https://developers.google.com/web/tools/chrome-devtools/javascript/step-code step over next function ...

  8. Django中Cookie和Session配置和操作

    Cookie Cookie以键值对Key-Value形势进行信息的存储. Cookie基于域名安全,不同域名的Cookie是不能互相访问的 Cookie是存储在浏览器中的一段纯文本信息,建议不要存储敏 ...

  9. CentOS6.5 编译安装PHP5.6(apache模块)

    一.环境准备 1. 下载php源码包 # wget http://cn2.php.net/distributions/php-5.6.30.tar.gz # tar -xf php-5.6.30.ta ...

  10. C# 获取当前网页HTML

    //引用COM组件 //Microsoft HTML Object Library //Microsoft Internet Controls SHDocVw.ShellWindows shellWi ...