Question

我使用Handsontable创建了一个简单的单列表。我希望用户能够以hh：mm：ss格式输入时间，但我发现秒是一个有效的输入，如120s = 00:02:00。这不是很好，因为它的困难时间较长（小时）。

在numbers.js库中有一个函数格式和无格式时间，很好，我用它。唯一的问题是这个代码导致浏览器发疯。我想看看代码循环多少次，就像对单元格的一次更改导致18,000个循环周期一样，大部分时间都会导致浏览器崩溃。为什么它多次调用cellproperties.render O.o！？

有什么想法吗？

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<link rel="stylesheet" media="screen" href="http://localhost/handsontable-0.16.0/dist/handsontable.full.css">
<script src="http://localhost/handsontable-0.16.0/dist/handsontable.full.js"></script>

</head>
<body>
<div id="exampleGrid1" class="dataTable"></div>
<div id="exampleGrid2" class="dataTable"></div>
<script type="text/javascript">
    $(document).ready(function () {
    var data = [
    [0],
    [0],
    [0],
    [0],
    [0],
    [0],
    [0],
    ];


function ValueRenderer2(instance, td, row, col, prop, value, cellProperties) {
        Handsontable.renderers.NumericRenderer.apply(this, arguments);

        var a = numeral().unformat(td.innerHTML);

        console.log(a + 'this');
        value = 'test';


          $('#exampleGrid1').handsontable('setDataAtCell', row, 0, a);
 }
var call = 0
var $container = $("#exampleGrid1");

$container.handsontable({
    data: data,
    colHeaders: ['Time'],
    width: 500,
     columns: [
          {
            type: 'numeric',
            format: '00:00:00',
          },
          ],
    cells:   
        function (col, prop) {
            var cellProperties = {};
            cellProperties.renderer = ValueRenderer2;

            call++;
            console.log("the call is on: " + call);
            return cellProperties;
        },
});







});
</script>

</body>
</html>

Answer 1

自定义ValueRenderer2单元格渲染器中的最后一行创建了一个隐式递归，因为setDataAtCell强制在表格上执行完整渲染，然后再次调用ValueRenderer2。

如果我的问题正确，您可能需要自定义单元格编辑器，而不是自定义渲染器。您可以阅读有关编辑器here的更多信息。

Handsontable更新单元格崩溃浏览器

1 个答案: