前端大量重复请求

例如人员信息这样的组件，根据id获取信息， 可能一下会请求很多次数据， 前端需要处理

 userRequest: Array<{ key: string, list: Array<any> }> = [];

  timer: null | number = null;

  result: Array<{ k: string, v: User }> = [];

  getUserByUsername(username: User["username"]) {

    if (this.timer) {
      clearTimeout(this.timer);
    }

    this.timer = setTimeout(() => {
      const sedRequest = this.userRequest.map(({ key }) => ({ key, list: [this.getUserByUserName(key)] }));
      sedRequest.forEach(({ key, list }) => { list[0].then(res => { this.userRequest.forEach(({ key: username, list }) => { if (key === username) { list.forEach(item => { item(res) }) } }) }) })
    }, 1000)

    // const index = this.userRequest.findIndex(({ key }) => key === username);

    // index > -1 ? this.userRequest[index].list.push((k: any) => Promise.resolve(k)) : this.userRequest.push({ key: username, list: [(k: any) => Promise.resolve(k)] });

    // const sedRequest = this.userRequest.map(({ key, list }) => ({ key, list: Array.from(new Set(list)) }));

    return new Promise((resolve, reject) => {
      const index = this.userRequest.findIndex(({ key }) => key === username);
      index > -1 ? this.userRequest[index].list.push((k: User) => resolve(k)) : this.userRequest.push({ key: username, list: [(k: User) => resolve(k)] });
    })
  }
  
  getUserByUserName = MyIndexedDB.getUser(
    async (username: User["username"]) => {
      const { data } = await getUserByUsername(username);
      return data;
    },
    DBStoreName.User
  );

缓存处理

static nameList: Array<string> = [];
  // 获取用户
  static getUser<T>(func: T, storeName: DBStoreName): T {
    return async key => {
      const db = GlobalStore.getInstance().db;

      // 未连接库，直接获取
      if (!db) {
        return await func(key);
      }

      // 存储的数据
      const { ...result } =
        (await db.transaction(storeName).store.get(key)) || {};

      // 缓存有
      if (result.username === key) {
        // 超时重新获取
        if (MyIndexedDB.isTimeOut(result.cacheTime)) {
          const data = await func(key);
          data.cacheTime = Date.now();
          await db.transaction(storeName, "readwrite").store.put({ ...data });
          delete data.cacheTime;
          return data;
          // 未超时直接用
        } else {
          delete result.cacheTime;
          return result;
        }
        // 缓存没有
      } else {
        const data = await func(key);
        MyIndexedDB.nameList = Array.from(new Set(MyIndexedDB.nameList));
        data.cacheTime = Date.now();
        const flag = await MyIndexedDB.exit(key);
        if (!flag) {
          await db.transaction(storeName, "readwrite").store.add({ ...data });
        }
        MyIndexedDB.nameList.push(key);
        delete data.cacheTime;
        return data;
      }
    };
  }
  static exit(username: string) {
    return Promise.resolve(
      MyIndexedDB.nameList.some(item => item === username)
    );
  }