jquery - MaterializeCSS 芯片 onChipAdd 回调不起作用

Question

我正在使用materializecss编写一个表单字段，其中包含带有自动完成选项的mat-chips。这个想法是每当添加新芯片时就发出 PATCH 请求。以下是我当前使用的代码片段:

$('#tag-chips').material_chip({
        autocompleteOptions: {
            data: {
                'golang': null,
                'docker': null,
                'kubernetes': null
            }
        },
        onChipAdd: () => {
            console.log('tag added');
        }
    });

芯片字段工作完美，但回调似乎从未启动。控制台中也没有错误消息。

根据我所做的一些搜索，我还尝试了其他方法来实现这一目标:

$('#tag-chips').on('chip.add', (event, chip) => {
        console.log(event, chip);
});

但没有任何帮助。

Answer 1

ES6方式使用箭头函数，可以这样调用函数。

HTML

<div class="container">
    <div class="chips chips-autocomplete"></div>
</div>

jQuery

$(document).ready(function () {
    $('.chips-autocomplete').chips({
        autocompleteOptions: {
            data: {
                'Apple': null,
                'Microsoft': null,
                'Google': null
            },
            limit: Infinity,
            minLength: 1
        },
        onChipAdd: () => {
            console.log("Chip Added");
        },
        onChipSelect: () => {
            console.log("Chip Selected");
        },
        onChipDelete: () => {
            console.log("Chip Deleted");
        }
    });
});