Преглед изворни кода

fix key prop for PaginationWrapper

Yuki Takei пре 6 година
родитељ
комит
8a04624d9e
1 измењених фајлова са 12 додато и 10 уклоњено
  1. 12 10
      src/client/js/components/PaginationWrapper.jsx

+ 12 - 10
src/client/js/components/PaginationWrapper.jsx

@@ -72,20 +72,20 @@ class PaginationWrapper extends React.Component {
     const paginationItems = [];
     const paginationItems = [];
     if (activePage !== 1) {
     if (activePage !== 1) {
       paginationItems.push(
       paginationItems.push(
-        <PaginationItem>
+        <PaginationItem key="painationItemFirst">
           <PaginationLink first onClick={() => { return this.props.changePage(1) }} />
           <PaginationLink first onClick={() => { return this.props.changePage(1) }} />
         </PaginationItem>,
         </PaginationItem>,
-        <PaginationItem>
+        <PaginationItem key="painationItemPrevious">
           <PaginationLink previous onClick={() => { return this.props.changePage(activePage - 1) }} />
           <PaginationLink previous onClick={() => { return this.props.changePage(activePage - 1) }} />
         </PaginationItem>,
         </PaginationItem>,
       );
       );
     }
     }
     else {
     else {
       paginationItems.push(
       paginationItems.push(
-        <PaginationItem disabled>
+        <PaginationItem key="painationItemFirst" disabled>
           <PaginationLink first />
           <PaginationLink first />
         </PaginationItem>,
         </PaginationItem>,
-        <PaginationItem disabled>
+        <PaginationItem key="painationItemPrevious" disabled>
           <PaginationLink previous />
           <PaginationLink previous />
         </PaginationItem>,
         </PaginationItem>,
       );
       );
@@ -102,8 +102,10 @@ class PaginationWrapper extends React.Component {
     const paginationItems = [];
     const paginationItems = [];
     for (let number = paginationStart; number <= maxViewPageNum; number++) {
     for (let number = paginationStart; number <= maxViewPageNum; number++) {
       paginationItems.push(
       paginationItems.push(
-        <PaginationItem active={number === activePage}>
-          <PaginationLink onClick={() => { return this.props.changePage(number) }}>{number}</PaginationLink>
+        <PaginationItem key={`paginationItem-${number}`} active={number === activePage}>
+          <PaginationLink onClick={() => { return this.props.changePage(number) }}>
+            {number}
+          </PaginationLink>
         </PaginationItem>,
         </PaginationItem>,
       );
       );
     }
     }
@@ -119,20 +121,20 @@ class PaginationWrapper extends React.Component {
     const paginationItems = [];
     const paginationItems = [];
     if (totalPage !== activePage) {
     if (totalPage !== activePage) {
       paginationItems.push(
       paginationItems.push(
-        <PaginationItem>
+        <PaginationItem key="painationItemNext">
           <PaginationLink next onClick={() => { return this.props.changePage(activePage + 1) }} />
           <PaginationLink next onClick={() => { return this.props.changePage(activePage + 1) }} />
         </PaginationItem>,
         </PaginationItem>,
-        <PaginationItem>
+        <PaginationItem key="painationItemLast">
           <PaginationLink last onClick={() => { return this.props.changePage(totalPage) }} />
           <PaginationLink last onClick={() => { return this.props.changePage(totalPage) }} />
         </PaginationItem>,
         </PaginationItem>,
       );
       );
     }
     }
     else {
     else {
       paginationItems.push(
       paginationItems.push(
-        <PaginationItem disabled>
+        <PaginationItem key="painationItemNext" disabled>
           <PaginationLink next />
           <PaginationLink next />
         </PaginationItem>,
         </PaginationItem>,
-        <PaginationItem disabled>
+        <PaginationItem key="painationItemLast" disabled>
           <PaginationLink last />
           <PaginationLink last />
         </PaginationItem>,
         </PaginationItem>,
       );
       );