0

なぜこれが起こっているのか理解できません。別のスワイパーにネストされたスワイパーがあります（1つは垂直スクロール用、もう1つは水平用です。私を狂わせる原因は、ネストされたスワイパーを破棄する必要があるときに定義されていないことです。これが私がやっていることです：

function embedSwiper(){
var embeddedEcosystem = new Swiper('.swiper-nested', {
    //Styling set in bootstrap.min.css for pagination
    mode: 'vertical',
    pagination: '.pagination-nested',
    paginationClickable: true,

    simulateTouch : true,

});

embeddedEcosystem.swipeTo(0, 500, false);
return embeddedEcosystem;
}

これによりスワイパーが作成され、次の関数に返されます。

function reInitEmbedded(){
    setTimeout(function(){
        embed = embedSwiper();
        $(".swiper-nested").css({"height" : "0px"});
        $(".swiper-nested").css({"height" : $(".internal-relations").height()});
        useLocalImg();
        embed.reInit();
        //Set the slide height properly since it never works as intended
        return embed;
    }, 600);
}

ここで高さを設定する必要があります。そうしないと、スライドが適切に取り付けられません (はい、高さを計算しようとしましたが、ワークライトを使用しているため、モバイルで問題が発生していました)。

さて、ここで物事がうまくいくところです。これをクロムでテストしています（申し訳ありませんが、現時点で提供できるリンクはありません）。

//Resize cards
             swiper =  reinitSwiper();
             innerSwiper = reInitEmbedded();

             //Show info 
             detailsTransition();

             //Hides the overlay, and empties the panels to be filled next time
             //Bound calls for use when needed
             $(".back-button.btn.btn-primary.pull-left").on('click', function(){
                 goBack(lookUpName);
                 innerSwiper.destroy();
                 swiper.destroy();
             });

ご覧のとおり、swiper機能する変数があり、正常に破棄できます。また、innerSwiper があります。残りは関係ありません。これより前は機能していたからです。私を夢中innerSwiperにさせているのは、それが . だから私の質問は:私が未定義になり続けるのは何が間違っているのですか?undefinedreturns

4

3 に答える 3

2

これは、スコープの問題によるものです。

クリック ハンドラー内では、スコープが変更され、innerSwiper にアクセスできません。したがって、代わりに次のようにします。

         this.swiper =  reinitSwiper();
         this.innerSwiper = reInitEmbedded();
         var self = this; // HOLD REFERNECE TO THIS AS SELF  


         //Show info 
         detailsTransition();

         //Hides the overlay, and empties the panels to be filled next time
         //Bound calls for use when needed
         $(".back-button.btn.btn-primary.pull-left").on('click', function(){
             goBack(lookUpName);
             self.innerSwiper.destroy(); // here you use self that has reference to swiper
             self.swiper.destroy();
         });

Thom x が指摘したもう 1 つの間違い。次のように修正します。

// Make sure self is defined be before this function

function reInitEmbedded(){
    setTimeout(function(){
        embed = embedSwiper();
        $(".swiper-nested").css({"height" : "0px"});
        $(".swiper-nested").css({"height" : $(".internal-relations").height()});
        useLocalImg();
        embed.reInit();
        //Set the slide height properly since it never works as intended
        self.innerSweeper =  embed; // change this
    }, 600);
}
于 2014-07-29T17:41:12.613 に答える
1

reInitEmbedded は値を返しません。

function reInitEmbedded(){
    setTimeout(function(){
       return true;
    }, 600);
}

var a = reInitEmbedded();
console.log(a);

==>未定義

于 2014-07-29T17:43:20.293 に答える
0

さて、私は自分が間違っていたことを理解しました。とがグローバルでswiperありinnersSwiper、setTimeout が何も返せないことに気付いていなかったため、グローバル変数に直接アクセスする必要がありました。そしてinnerSwiper、reInitEmbedded で単語を使用していなかったので、適切に参照していませんでした。

于 2014-07-29T19:32:16.680 に答える