封装返回类型映射方法

vue3 貌似没有filter方法 所以你就算在写vue2也别用filter了 直接用这种方法吧

// 获取类型映射
const returnType = (list, value, name, code) => {
    for (let i = 0; i < list.length; i++) {
        if (list[i][code] === value) {
            return list[i][name];
        }
    }
};
// 例： 映射表 通常会集中放在一个地方 这里单独拿出示范
const statusList = [
  { label: "低", value: 0 },
  { label: "中", value: 1 },
  { label: "高", value: 2 },
];
// 调用
<template>
    <span>{{ returnType(statusList, scope.record.status, 'label', 'value') }}</span>
</template>

这一阵react也简单写了个方法 其实vue react都是一样用的 先放在这里记录一下

/**
 * 对应label展示
 * @param list 枚举列表 array
 * @param findKey 需要找到的值 array | string
 * @param keyCode list中根据此值查找当前项
 * @param keyName 需要返回展示的字段值
 * @param needJoin 是否需要展示分割
 * @returns array | string
 */
export const mappingRelation = (
  list: any[],
  findKey: number | string | any,
  keyCode: number | string,
  keyName: number | string,
  needJoin: string,
) => {
  let value = null;
  if (Array.isArray(findKey)) {
    value = [];
    let findValue = '';
    findKey.map((keyItem: any) => {
      let hasName = list.some((item) => {
        if (item[keyCode] === keyItem) {
          findValue = item[keyName];
          return true;
        }
      });
      if (!hasName) {
        findValue = '其他';
      }
      value.push(findValue);
    });
  } else {
    let hasName = list.some((item) => {
      if (item[keyCode] === findKey) {
        value = item[keyName];
        return true;
      }
    });
    if (!hasName) {
      value = '其他';
    }
  }
  if (needJoin) {
    return value.join(needJoin);
  }
  return value;
};


mappingRelation(list,  findArr, 'value', 'label', '、'),