14

プリフェッチを使用したいのですが、動作させることができません! これが私のコードです:

function initAutocompletion() {
    $("input[data-autocomplete-prefetch-url]").each(function () {
        var $this = $(this);
    var urlPrefetch = $this.data("autocomplete-prefetch-url");
    var prefetch;

    pref = {
        url: urlPrefetch,
        filter: filter
    };

    var bloodHound = new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        limit: 10,
        prefetch: pref
    });

    bloodHound.initialize();

    $this
        .typeahead('destroy')
        .typeahead({
            hint: true,
            highlight: true,
            minLength: 1
        },
        {
            displayKey: 'value',
            source: bloodHound.ttAdapter()
        });
    });
 }

function filter(list) {
    return $.map(list, function (v) { return { value: v.toString() }; });
}

うまくいきません。

プリフェッチの代わりにリモートを使用すると動作します!

    var bloodHound = new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        limit: 10,
        remote: pref
    });

理解できない。

誰でも私を助けることができますか？

4

4 に答える 4

10

これは、typeahead が既にプリフェッチ URL からデータを読み込んで に保存しているためですlocalStorage。データが にある時点ではlocalStorage、プリフェッチは呼び出されません。

cacheKey以下のようにプリフェッチオプションを変更して、ページをリロードしてみてください。の新しい cacheKey に関連付けられたデータがないため、プリフェッチが呼び出されlocalStorageます。

var engine = new Bloodhound({
  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  prefetch: {
    url: "stations.json",
    cacheKey: "change here!"
  }
});

Chrome 開発者ツールでローカル ストレージを確認することもできます。

ここに画像の説明を入力

ローカル ストレージ データを削除し、ページをリロードしてみてください。プリフェッチが呼び出されます。

Bloodhound の初期化の前に localStorage データを削除するには、初期化のたびにプリフェッチが呼び出されるようにします。

localStorage.removeItem("YOUR CACHEKEY");

// Bloodhound initialization with YOUR CACHEKEY.

clearPrefetchCache()前initialize()の方がいいと思います。

于 2015-03-14T17:18:49.287 に答える
0

おそらく、urlPrefetch が値を取得する前にデータをプリフェッチしようとしています。urlPrefetch をコンソールにダンプして、有効な URL があることを確認してください。

于 2014-05-11T03:15:03.290 に答える