Spotify API - 自动填充搜索结果为空

时间:2016-09-30 13:05:54

标签: javascript jquery api spotify

使用Spotify API - 我想使用jQuery在输入时自动填充艺术家的字段。到目前为止,我正在使用以下内容:

HTML:

<input type="text" class="text-box" placeholder="Enter Artist" id="artist-input"> 

使用Javascript:

$(document).ready(function() {

  $("#artist-input").autocomplete({
    source: function(request, response) {
        $.ajax({
            type: "GET",
            url: "https://api.spotify.com/v1/search",
            dataType: "json",
            data: {
                type: "artist",
                limit: 3,
                contentType: "application/json; charset=utf-8",
                format: "json",
                q: request.term
            },
            success: function(data) {
                response($.map(data.artists, function(item) {
                    return {
                        label: item.name,
                        value: item.name,
                        id: item.id
                    }
                }));
            }
        });
    },
    minLength: 3,
    select: function(event, ui) {
        $("#artist-input").val(ui.item.value);
        window.location.href = "#" + ui.item.value;
    },
});

});

运行此结果:

functions.js:35 Uncaught TypeError: Cannot read property 'name' of null

所以我的问题是我需要在此过程运行之前进行某种身份验证吗?我的思维过程就是它正在拨打电话,但它的回复为空,我错过了额外的一步......

以下是使用此示例的codepen:http://codepen.io/anon/pen/PGKLpj

1 个答案:

答案 0 :(得分:2)

您使用的数据结构略有不同。它是data.artists.items而不是data.artists。如果你遍历正确的属性,它就可以正常工作。

查看此笔:http://codepen.io/anon/pen/qaXvob

注意:有时候只看console.log(data);有助于查看json结构是否符合您的想法。