Javascript 创造；“下一步”；及；“以前的”；使用索引在数组中导航的按钮？

我正在尝试实现“下一步”和“上一步”按钮，以帮助我浏览数组中的项目

我使用数组中项目的索引来获取下一个或上一个项目

例如：

  arrA =  [{_id:1,name:"T-Rex"},{_id:3,name:"Predator X"},{_id:4 ,name:"Velociraptor"},{_id: 6, name:"Triceratops"}]

当前对象的id由表示

var selectedID = _id

下一个和上一个函数

  next(){
      var idx = arrA.map(x => x._id).indexOf(selectedID);

      if (idx === arrA.length - 1){
       //return first item
          var next_name = arrA[0].name;
      } else {
        var next_name = arrA[idx + 1].name
  }


  previous(){
      var idx = arrA.map(x => x._id).indexOf(selectedID);

        if (idx === arrA[0]){
         // return  last item
            var prev_name = arrA[arrA.length -1].name;
        } else{
          var prev_name = arrA[idx -1].name
  }

}

---

预期的结果是，当我单击其中一个按钮时，它应该将我带到下一个或上一个项目，但实际结果是它不停地在数组中循环。

使用模（%）时，一切都变得简单多了。它允许你在列表中前进（向前或向后），而不必担心你是在开始还是结束

const arr=[{{u id:1，名称：“T-Rex”}，{{u id:3，名称：“捕食者X”}，{{u id:4，名称：“迅猛龙”}，{u id:6，名称：“三角龙”}]
设currentIndex=0；
设currentId=arr[0]。\u id；
//初始日志
log（）；
函数next（）{
move（）；
}
函数previous（）{
移动（假）；
}
函数移动（前进=真）{
currentIndex=（currentIndex+（advance？1:-1）+arr.length）%arr.length；
currentId=arr[currentIndex]。\u id；
log（）；
}
函数日志（）{
日志（“索引：+currentIndex，Id:+currentId”）；
}

上一个
接下来

使用模（%）时，一切都变得简单多了。它允许你在列表中前进（向前或向后），而不必担心你是在开始还是结束

const arr=[{{u id:1，名称：“T-Rex”}，{{u id:3，名称：“捕食者X”}，{{u id:4，名称：“迅猛龙”}，{u id:6，名称：“三角龙”}]
设currentIndex=0；
设currentId=arr[0]。\u id；
//初始日志
log（）；
函数next（）{
move（）；
}
函数previous（）{
移动（假）；
}
函数移动（前进=真）{
currentIndex=（currentIndex+（advance？1:-1）+arr.length）%arr.length；
currentId=arr[currentIndex]。\u id；
log（）；
}
函数日志（）{
日志（“索引：+currentIndex，Id:+currentId”）；
}

上一个
下一步

如何调用下一步（）和上一步（）？如何调用下一步（）和上一步（）？这很好，但当我单击其中一个按钮时，它会卡在一个无限长的loop@SteveGaita你能澄清一下你所说的无限循环是什么意思吗？你指的是当你到达列表的末尾时，你从一开始就开始返回？无限循环，我的意思是，它不是通过点击任何一个按钮移动到下一个或上一个项目，而是只需点击一次，就可以在所有项目中移动循环，然后不停地重复整个过程。@SteveGaita，我的当前设置是不可能的。您是否连续多次使用循环调用

next

和

previous

。让我试着和大家分享一下我的实际代码实现。这很好，但当我点击其中一个按钮时，它就会陷入无限的困境loop@SteveGaita你能澄清一下你所说的无限循环是什么意思吗？你指的是当你到达列表的末尾时，你从一开始就开始返回？无限循环，我的意思是，它不是通过点击任何一个按钮移动到下一个或上一个项目，而是只需点击一次，就可以在所有项目中移动循环，然后不停地重复整个过程。@SteveGaita，我的当前设置是不可能的。您是否连续多次使用循环调用

next

和

previous

。让我试着分享我的实际代码实现