javascript - 用 map 打印 react 组件内的数字？

Question

这可能很简单，但我似乎无法弄明白。如何在列表中按顺序打印数字？如果我打印索引，由于我的条件，一些数字将被跳过？我可以在我的条件内的 map 函数中的某处设置一个计数++，以便每次打印列表项时它都会增加吗？

export const MFAPaging = ({rootStore, page}) => {
  let count = 1;

  return (
    <div className="components-paging-brder">
      <div className="components-paging">
        <ul>
          {rootStore.mfaStore.links.map((item, index) =>
              item && item.includePage ? 
              <li className={page == index ? 'active' : ''} key={index}>{count}</li>
              : undefined 
            )}
        </ul>
        <MFAButtons rootStore={rootStore} page={page} />
    </div>
  </div>
  );
};

Answer 1

首先你可以过滤数组，然后你的索引在你的 .map 中会很酷(永远不要使用 .map 来过滤，你已经有内置函数)

{rootStore.mfaStore.links.filter((item)=> item && item.includePage).map((item, index) =>
    <li className={page == index ? 'active' : ''} key={index}>{count}</li>
)}

有问题评论:)