0

バックボーンビューとモデルの通信に問題があります。ビューはモデルからのイベントをリッスンする必要があるため、関数couponReaderはモデルからデータを取得し、一種の確認後にカートに追加することになっています。どんな助けでも大歓迎です

define([
'jquery',
'underscore',
'backbone',
'text!templates/menu/menu.html',
'text!templates/menu/cartItem.html',
'collections/cart',
'views/menu/topBar',
'models/coupon',
'swipe'

], 
function ($, _, Backbone, menuTemplate, cartItemTemplate, Cart, TopBarView, Coupon)  {

var slider;
var sliderPosition = 0;
var top;

var menuView = Backbone.View.extend({
    el:$("body"),

    events:{
        "click #keno50":"addKeno50",

    },

    initialize:function () {

        this.couponReader();
    },

    render:function () {
        this.el.html(menuTemplate);
        // TODO - Memory leak here :O
        new TopBarView({ el: this.$('#topBar') }).render();
        this.slider = new Swipe(document.getElementById('slider'), {startSlide:sliderPosition});
        this.resizeScreen();
        return this;
    },

    couponReader:function () {
        var coupon = new Coupon({   //problem here
            name: Coupon.getCoupon().name,
            price: Coupon.getCoupon().price
        });
        Cart.add(coupon);
    },


    addKeno50:function () {
        var keno50 = {
            name:"Keno",
            price:50
        }
        Cart.add(keno50);
        sliderPosition = this.slider.getPos();
        this.render();
    }

});
return new menuView;
});

モデルクラス：ループでサーバーをリッスンし、データがロードされるたびにサーバーからデータを取得します。

define(['jquery', 'underscore', 'backbone'],
function ($,_, Backbone) {
    var Coupon = Backbone.Model.extend({
        initialize:function () {
           this.getCoupon(); //console.log("funkar*?");
        },
   getCoupon : function() {
        var XHR = this.getRequest();
    XHR.done(function(data){
        var keno10 = {
            name: data.description,
            price: parseInt(data.price)}

        var price = parseInt(data.price);
        var name = data.description;
        var status = data.ok;
    })
    },

    getRequest:function() {
        var fn = arguments.callee;
        var XHR = $.ajax({
            url: '/nextdocument',
            type: 'GET',
            async: true,
            cache: false,
            timeout: 11000, //vänta på svar från servern om ingen inläsning
            success:function(data) {
                var name = data.description;
                var price = data.price;
                console.log("read--> " + name + price);
                setTimeout(fn, 1000);
                if (data.ok == "true") {
                    data["ok"] = data.ok;
                    $.ajax(
                        {
                            url: "/customerdone",
                            data: JSON.stringify(data),
                            processData: false,
                            type: 'POST',
                            contentType: 'application/json'
                        }
                    )
                }else{
                    //no document if no read in
                    console.log("error--> " + data.errorMessage)
                }
            }
        })
        return XHR;
    }

    });
    return Coupon;
});
4

1 に答える 1

0

あなたの例にはいくつかの問題があります。

  1. menuViewはCouponイベントにバインドしないため、Couponがイベントをディスパッチする場合、menuViewはそれを認識しません。

  2. モデルのURLを指定し、データを取得するための独自のAjax呼び出しを追加するのではなく、fetch（）を使用してBackboneにデータを取得させることができます。

    initialize: function () {
  this.coupon = new Coupon();
  this.coupon.bind('change', this.couponCreated, this);
  this.coupon.fetch();
},
couponCreated: function () {
  Cart.add(this.coupon);
}

  3. 同じデータを取得するために3つのajax呼び出しを行っているようです。たとえば、menuView.couponReader（）では、new Coupon（）とCoupon.getCoupon（）を2回実行します。これらのそれぞれが、設定した方法で新しいAjax呼び出しを行います。

あなたの例であなたが何をしようとしていたかを推測するのは困難でした。menuViewの作成時に新しいクーポンを取得してカートに追加しようとしているようです。その場合は、前に説明したURL / fetch（）メソッドを調べることを検討してください。コールバックで処理できるため、イベントをリッスンする必要はありません。実際、発生している問題は、Ajax呼び出しがデータとともに返される前に、クーポンをカートに追加している非同期の問題である可能性があります。

    couponReader: function () {
      var self = this
        , coupon = new Coupon();
      coupon.fetch({success: function (model, response) {
        Cart.add(model);
      });
    }

または、コールバックなしでfetch（）を実行し、＃2で前述したように、代わりに「change」イベントをリッスンすることもできます。

注：これらの例はどちらも、モデルのurlプロパティを使用してデータを同期するBackboneのメカニズムの使用に依存しています。

于 2012-05-11T05:19:07.160 に答える