• TypeScript中把List转Map的方法选择、选错了的后果以及注意事项


     假定deptList的值:

    1. deptList:[
    2.     {deptName: 'aaa', releaseType: '1'},
    3. {deptName: 'bbb', releaseType: '2'},
    4. {deptName: 'ccc', releaseType: '3'},
    5. ]

     1. 以下可以把deptList的值转换成map 

    this.deptMap = deptList.map(item => ({ label: item.deptName, value: item.releaseType }));

    2.  遍历deptList中的实体属性releaseType包含 '1'的添加到map中,并赋值给deptMap 

    1. this.deptMap = deptList.map(dept => {
    2. let aa = 1;
    3. let includeOne = dept.releaseType.includes(aa.toString());
    4. if (includeOne) {
    5. return { label: dept.deptName, value: dept.deptId };
    6. }
    7. });

    重点: 有个问题很严重,当includeOne=false时会返回一个undefined给map中,就会造成你引用deptMap的地方一旦取值就会抛异常,页面无法正常显示,debugger能看到除了满足releaseType包含 '1'的map外,还包含有不满足的undefined ,因此一定要慎重选择

    3. 使用filter过滤元素,匹配才返回给map ,这样就不会出现不符合时返回undefined的情况

    1. this.deptMap = deptList.filter(dept => {
    2. return dept.releaseType.includes(this.form.releaseType.toString());
    3. }).map(dept => {
    4. return { label: dept.deptName, value: dept.deptId };
    5. });

    总结: 如果需要直接把List转map那就使用 第一种方法,如果需要筛选再转map那就使用第3种filter过滤后再返回 ,第2种只是举例进行区分选择不对的严重性

  • 相关阅读:
    html 标签简介
    ES6中新增加的Proxy对象及其使用方式
    第2章-矩阵及其运算-矩阵运算(2)
    Unity Xlua热更新框架(四):热更新
    详解环境变量
    IceRPC之如何创建连接connection
    ESXI之IOChain网络框架
    如何把arguments转换为数组
    Windows10关闭系统自动更新
    [附源码]Python计算机毕业设计Django学生社团信息管理系统
  • 原文地址:https://blog.csdn.net/qq3892997/article/details/134290874