获取可动手操作的 JSON 表示

Get the JSON representation of a handsontable

下面的脚本可以制作一个3x2的editable table:JSBin:

<!DOCTYPE html>
<html>
<head>
  <script src="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.min.js"></script>
  <link type="text/css" rel="stylesheet" href="https://docs.handsontable.com/pro/1.8.2/bower_components/handsontable-pro/dist/handsontable.full.min.css">
</head>
<body>
  <div id="example1" class="hot handsontable htRowHeaders htColumnHeaders"></div>
  <br><br>
  <div class="json-result">to print a JSON representation</div>
</body>
</html>

JavaScript:

document.addEventListener("DOMContentLoaded", function() {

  function getData() {
    return [
      ['A1', 'B1'],
      ['A2', 'B2'],
      ['A3', 'B3']];
  }

  var
    example1 = document.getElementById('example1'),
    settings1,
    hot1;

  settings1 = {
    data: getData(),
    rowHeaders: false,
    colHeaders: false,
    contextMenu: false
  };
  hot1 = new Handsontable(example1, settings1);

});

手动更改 table 中的一些值后,我想 return 一个 JSON 值代表 table 的单元格的值,并且在 div json-result 打印它。有谁知道 API 我可以用什么来做到这一点?

巧合的是,您要查找的函数名为 getData。您可以在 Handsontable 实例上使用它,您将获得一个数组数组,代表 table 中的当前数据。从那里开始,您可以将 json 重新格式化为您喜欢的任何格式,或者只是 JSON.strigify 它。这是 working example.