9

jQuery プラグインのフル カレンダーを backbone.js と組み合わせて使用​​していますが、最初の読み込み時に正しく表示されないという問題があります。

これは、カレンダーを含むバックボーン ビューのレンダリング関数です。

render: function() {

    var that = this;

    // DEBUG:
    // console.log({entries: data});

    this.$el.html(this.template(this.serialize()));

    this.$('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },

        height: that.$el.parent().height()
    });

            // prints undefined
    console.log(this.$('#calendar').fullCalendar('getView').title);

    window.setTimeout(function() {
        this.$('#calendar').fullCalendar('changeView','agendaWeek');
    }, 500);


    return this;
}

500 ミリ秒のタイムアウトが含まれていることがわかります。その 500 ミリ秒を遅らせてから、ビューをアジェンダウィークに変更すると、表示されます。ただし、遅らせないとカレンダーが表示されません。どちらの場合もエラーは出力されません。

ここで何を試すべきか、または何がうまくいかないのか途方に暮れています。ドキュメントのどこかに欠けているカレンダーを作成するためのコールバックはありますか?

ありがとう

編集: .html() 関数が完全ではなく、問題が発生している可能性がありますか?

4

2 に答える 2

13

同様の問題があり、ドキュメントで次の重要な情報を見つけました。

http://arshaw.com/fullcalendar/docs/display/render/

私のカレンダーは現在選択されていないタブにあり、親コンテナーが表示されず、正しく描画されませんでした。タブを選択した後に render メソッドの呼び出しを追加すると、すべてうまくいきました。

あなたの問題は同様の方法で解決されるかもしれません。

于 2013-08-27T10:53:47.017 に答える
1

私は backbone.js を使用していますが、私も同じ問題を抱えていました。

イベントでカレンダーを宣言して初期化していOnRender()ました。

後でこの問題を解決するために、カレンダーを宣言して初期化するためのコードをOnShow()イベントに移動しました。

問題：

私の問題によると、require 要素が DOM に存在しなかったことが原因でした。OnShow()DOM の準備が完全に整ったときに起動されます。

最後に、それは私のために働きました。

于 2016-08-04T08:46:59.930 に答える