頁編號組件，尋找路徑的地圖數組

Question

我想創建一個頁面編號組件使用一個對象數組，包含一個路徑和ID。

import React from 'react'; 

export function PageNumber(props) { 

const pageData = [ 
{path: '/calc/1', id:1}, 
{path: '/calc/2', id:2}, 
{path: '/calc/3', id:3}, 
{path: '/calc/4', id:4}, 
{path: '/calc/5', id:5}, 
{path: '/calc/6', id:6}, 
{path: '/calc/7', id:7} 
] 

const CurrentPage = props.location.pathname; 
const numberOfPages = pageData.length; 

如何映射我的數組並僅顯示當前頁面？

return (
     <div>{   
      pageData.map(page => { 
       page.path == CurrentPage ? page.path : '' 

       <span>{page.path} of {numberOfPages}</span> 
      })} 
     </div> 
); 
} 

Answer 1

映射可能不需要你的情況。試試這個：

const CurrentPage = props.location.pathname || pageData[0] ; 
return (
    <span>{CurrentPage.path} of {pageData.length}</span> 
);