簡體   English   中英

設置cookie后,Ember模板沒有重新加載

[英]Ember template not reloading after i set cookie

我有一點問題。 我有一個“使用按鈕”,它設置一個cookie,告訴我使用了這筆交易。 按鈕開關狀態為禁用。

問題是,如果你前后退,按鈕不再被禁用,你仍然可以使用按鈕。 如果刷新頁面,該按鈕將被禁用。

這是我的代碼:

 export default Ember.Controller.extend(MobileHelper, { goodie: Ember.computed.alias('model'), tracker: Ember.inject.service(), used: undefined, fieldUsed: function(){ var pack_id = this.get('goodie.packContents.firstObject.id'); var cookies; if (this.cookie.getCookie('gp_pv') === undefined) { return false; } else { cookies = JSON.parse(this.cookie.getCookie('gp_pv')); } return cookies[String(pack_id)] === 1; }.property('goodie.packContents.firstObject.id'), profileComponent: function() { return `goodie-${this.get('goodie.type')}-profile`; }.property('goodie.type'), actions: { markSwiped: function() { var cookies; if (confirm("Er du sikker?")){ if (this.cookie.getCookie('gp_pv') === undefined){ cookies = {}; } else { cookies = JSON.parse(this.cookie.getCookie('gp_pv')); } var pack_id = this.get('goodie.packContents.firstObject.id'); if (cookies[String(pack_id)] !== 1){ cookies[String(pack_id)] = 1; } jQuery("#itemUsable").hide(); jQuery("#itemUsed").show(); this.get('tracker').trackGoodieExternalLinkClick(this.get('goodie')); this.cookie.setCookie('gp_pv', JSON.stringify(cookies), { expires: 50000, path: '/' }); this.container.lookup('view:toplevel').rerender(); route.transitionTo("index") } } } }); 
  {{#if fieldUsed}} <style> #itemUsable {display:none;} #itemUsed {display:block;} </style> {{else}} <style> #itemUsable {display:block;} #itemUsed {display:none;} </style> {{/if}} <div class="container" id="itemUsed"> <div class="goodie-page-swipe-action"> <div class="row"> <div class="col-xs-offset-3 col-xs-6"> <div class="btn gp-btn-primary btn-block btn-lg disabled">{{ t 'goodie.used'}}</div> </div> </div> </div> </div> <div class="container" id="itemUsable"> <div class="goodie-page-swipe-action"> <div class="row"> <div class="col-xs-offset-3 col-xs-6"> <div {{ action 'markSwiped' }} class="btn gp-btn-primary btn-block btn-lg">{{ t 'goodie.use'}}</div> </div> </div> </div> </div> 

計算屬性值通常被緩存,並且僅在從屬鍵的值更改時才更新。 從提供的代碼中可以看出,當markSwiped運行時, goodie.packContents.firstObject.id立即發生變化。 我想它沒有,因為fieldUsed因此你的模板沒有得到更新(這意味着你更新的cookie值永遠不會被重新評估,直到整頁刷新)。

想到的事情你可以嘗試:

  • 你可以嘗試使fieldUsed成為一個volatile屬性 ,希望它能在每次使用時重新評估(不再緩存)

     fieldUsed: function() {...}.volatile() 
  • 使fieldUsed取決於其他值,或者另外。 例如,作為一個拐杖,你可以測試一些無關的計數器類型變量,它只是在markSwiped某處markSwiped

     crutchCounter: 0, fieldUsed: function() {}.property('goodie.packContents.firstObject.id', 'crutchCounter'), markSwiped: function() {...; this.incrementProperty('crutchCounter'); ...} 

如果其中任何一個工作,那么您也可以放棄在markSwiped的jQuery DOM操作。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM