Question

我有一个从对象渲染的数据表。具体来说，表的每一行都是数组中的值。

我需要能够在数组中向上或向下移动对象，具体取决于单击的按钮。

var obj = [{
  "RuleDetailID": "11624",
  "AttributeValue": "172",
  "Value": "Account Manager",
  "IsValueRetired": "0"
}, {
  "RuleDetailID": "11626",
  "AttributeValue": "686",
  "Value": "Agent",
  "IsValueRetired": "0"
}, {
  "RuleDetailID": "11625",
  "AttributeValue": "180",
  "Value": "Analyst",
  "IsValueRetired": "0"
}, {
  "RuleDetailID": "11629",
  "AttributeValue": "807",
  "Value": "Individual Contributor",
  "IsValueRetired": "0"
}, {
  "RuleDetailID": "11627",
  "AttributeValue": "690",
  "Value": "Senior Agent",
  "IsValueRetired": "0"
}];

// Exmaple only, just rendering a table
function renderExample() {
  var table = '';
  for (var key in obj) {
    table += "<tr><td>" + obj[key].Value + "</td><td><a href=\"#\" onClick=\"move('up', " + obj[key].RuleDetailID + ")\">Move Up</a></td><td></td><td><a href=\"#\" onClick=\"move('down', " + obj[key].RuleDetailID + ")\">Move Down</a></td></tr>";
  }
  return table;
}

// Move the object in the array up or down
function move(value, positionChange) {

  // On run, move the object in the array up or down respectivly.

}

<table>
  <tbody id="example">
    <script>
      document.write(renderExample())
    </script>
  </tbody>
</table>

这可以用lodash之类的东西来完成，还是更多的是手动方式？我尝试获取所点击项目的索引，然后相应地执行+1或-1以获得新索引。但是，我不知道该做什么，因为该索引已经存在另一个项目。

我该如何实现这一目标？不是寻找jQuery方法，javascript或只有lodash等库。

Answer 1

您可以使用array.splice两次，首先删除要移动的项目，然后将其插入新位置

＆＃13;

var data = [1,2,3,4,5];

function moveItem(from, to) {
  // remove `from` item and store it
  var f = data.splice(from, 1)[0];
  // insert stored item into position `to`
  data.splice(to, 0, f);
}

moveItem(0, 2);

console.log(data);

＆＃13;

Answer 2

您还可以使用旧式互换机制：

setup.py

在数组中上下移动对象

2 个答案: