Uikit.可嵌套组件-如何从移动的项目获取id

我正在使用uikit框架，并且有一个来自可嵌套组件的问题。

我一直在寻找解决方案，但似乎没有人看起来和我一样。

可能是由于我对javascript的了解不多，但是阅读他们在UIKit网站上关于可用事件的介绍，我无法得到我需要的。

我有这些代码在html上创建可嵌套组。它用于将一项从一组向左移动，另一组向右移动。

<div class="uk-grid uk-grid-width-1-2">
    <div>
        <h3>Disabled</h3>
        <!-- Group A -->
        <div class="uk-margin">
            <div class="ptm-nestable-title">
                <i class="uk-icon uk-icon-plus-square-o uk-margin-small-right"></i> <strong>Main perms</strong>
            </div>
            <div class="ptm-nestable-list">
                <ul class="uk-nestable" data-uk-nestable="{group:''group-a'', maxDepth:1}" id="groupADisable">
                    <li class="uk-nestable-item" id="manageUsers">
                        <div class="uk-nestable-panel">
                            <strong>Users</strong> - Manage
                        </div>
                    </li>
                    <li class="uk-nestable-item" id="manageRepairs">
                        <div class="uk-nestable-panel">
                            <strong>Repairs</strong> - Manage
                        </div>
                    </li>
                    <li class="uk-nestable-item" id="managePhone">
                        <div class="uk-nestable-panel">
                            <strong>Phonecalls</strong> - Manage
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!-- Group B -->
        <div class="uk-margin">
            <div class="ptm-nestable-title">
                <i class="uk-icon uk-icon-plus-square-o uk-margin-small-right"></i> <strong>Private perms</strong>
            </div>
            <div class="ptm-nestable-list">
                <ul class="uk-nestable" data-uk-nestable="{group:''group-b'', maxDepth:1}" id="groupBDisable">
                    <li class="uk-nestable-item">
                        <div class="uk-nestable-panel" id="nameA">
                            <strong>Name A</strong> - Description
                        </div>
                    </li>
                    <li class="uk-nestable-item" id="nameB">
                        <div class="uk-nestable-panel">
                            <strong>Name B</strong> - Description
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <!-- END - GROUPS LEFT -->
    </div>
    <!-- RIGHT -->
    <div>
        <h3>Enabled</h3>
        <!-- Group A -->
        <div class="uk-margin">
            <div class="ptm-nestable-title">
                <i class="uk-icon uk-icon-plus-square-o uk-margin-small-right"></i> <strong>Main perms</strong>
            </div>
            <div class="ptm-nestable-list">
                <ul class="uk-nestable" data-uk-nestable="{group:''group-b'', maxDepth:1}" id="groupAEnable">
                </ul>
            </div>
        </div>
        <!-- Group B -->
        <div class="uk-margin">
            <div class="ptm-nestable-title">
                <i class="uk-icon uk-icon-plus-square-o uk-margin-small-right"></i> <strong>Private perms</strong>
            </div>
            <div class="ptm-nestable-list">
                <ul class="uk-nestable" data-uk-nestable="{group:''group-b'', maxDepth:1}" id="groupBEnable">
                </ul>
            </div>
        </div>
        <!-- END - GROUPS RIGHT -->
    </div>
</div>

我可以无缝地从组的左边移动到他们各自的右边。

但是使用web上可用的事件无法从项目中获取id。https://getuikit.com/docs/nestable.html

我使用的代码，然后只是得到源组和目标组的id在两个事件分开。

$('.uk-nestable').on('change.uk.nestable', function(e) {
    console.log($(this).attr('id');
});

如果我更改并放置组(.uk-nestable)，则项目(.uk-nestable-item)不能收到任何东西。

$('.uk-nestable-item').on('change.uk.nestable', function(e) {
    console.log($(this).attr('id');
});

虽然它在网上列出了应该有一个事件与项目。

.change.uk.nestable事件，可排序对象，拖动元素，行动

我提前感谢你的帮助

我试过这样做，但是我在控制台上得到了很多消息，就像我拥有的项目一样。

UIkit.ready(function() {
    var linea = UIkit.nestable(UIkit.$('.uk-nestable-item'));
    linea.on('change.uk.nestable', function () {
        console.log($(linea.placeEl).attr('id'));
    });
});