时间戳

首页 > 解决方案 > 如何在数组中子项

javascript - 如何在数组中子项

问题描述

大家好，我有以下代码：我的代码

在这种情况下，我从后端接收一些数据

const fileName = 
  [ { id: 1, title: 'Armenia lorem ipsum 15 - Oct 30.pdf' } 
  , { id: 2, title: 'France lorem ipsum 16 - Nov 30.pdf'  } 
  , { id: 3, title: 'German lorem ipsum 17 - Dec 30.pdf'  } 
  , { id: 4, title: 'English lorem ipsum 18 - Jan 08.pdf' } 
  ]

我正在计算所有标题字符的总和是否大于 40，那么我将隐藏其余元素（在我的情况下为标题）并用数字显示。那部分效果很好。

let lengthCount = 0;
let maxIndex = 0;
const allowCharCount = 40;
const file = [];
const File = ({ data }) => {
  data.map((item, index) => {
    if (lengthCount <= allowCharCount) {
      maxIndex = index;
      file.push(item);
    }
    lengthCount = lengthCount + item.title.length;
  });

  let myFiles = file.map((perFile) => (
    <span key={perFile.id} className="skillItem">
      {perFile.title}
    </span>
  ));

  return (
    <div className="skillWrapper">
      <div>{myFiles}</div>
      {lengthCount < 20 ? null : (
        <div className="skillNumber">+{data.length - maxIndex - 1}</div>
      )}
    </div>
  );

现在我正在尝试获取每个元素的标题并以这种方式转换它们：我需要从头开始获取 5 个字符，然后连接“...”，然后从末尾连接 10 个字符。

我尝试从头到尾替换我的标题，但它不起作用

“TypeError：titleFullName.substr 不是函数”

我在这里尝试：

let titleFullName = file.map((item) => item.title);
let titleFullNameFirstPart = titleFullName.slice(0, 5);
const titleFullNameSecondPart = titleFullName.slice(10,titleFullName.length - 1);
const TitleName = titleFullNameFirstPart + "..." + titleFullNameSecondPart;

最后，对于每个标题，我应该得到类似的东西，例如：

Armen... Oct 30.pdf
Franc... Nov 30.pdf
Germa... Dec 30.pdf
Engli... Jan 08.pdf

标签： javascriptreactjs

解决方案

由于要转换数组，因此应将字符串转换逻辑放在中.map，以便迭代的每个项目都得到转换。您titleFullNameSecondPart还需要稍微调整一下，从字符串长度中减去 10 并将其传递给以.slice获取最后 10 个字符。

const fileName = [{
    id: 1,
    title: "Armenia lorem ipsum 15 - Oct 30.pdf"
  },
  {
    id: 2,
    title: "France lorem ipsum 16 - Nov 30.pdf"
  },
  {
    id: 3,
    title: "German lorem ipsum 17 - Dec 30.pdf"
  },
  {
    id: 4,
    title: "English lorem ipsum 18 - Jan 08.pdf"
  }
];

const transformed = fileName.map((item) => {
  const titleFullName = item.title;
  let titleFullNameFirstPart = titleFullName.slice(0, 5);
  const titleFullNameSecondPart = titleFullName.slice(titleFullName.length - 10);
  const TitleName = titleFullNameFirstPart + "..." + titleFullNameSecondPart;
  return TitleName;
});

console.log(transformed);

推荐阅读