2014-09-19 102 views
0

我想提出一個自定義的widget在Shopify請速與下面的代碼:數據事件點擊只調用一次,爲什麼?

<div class="main"> 
    <div id="bar"> 
    <a href="Info" data-event-click="toggleDetails">Info</a> 
    </div> 
    <div id="summary" data-bind="summary"></div> 
    <div id="info" data-bind="info"></div> 

    <h2 data-bind="more"></h3> 
</div> 

當「信息」標籤被點擊它應該切換窗口小部件中顯示的視圖。這在第一次點擊並且函數toggleDetails按預期方式調用時工作正常。當第二次或第三次點擊時,沒有任何事情發生,該功能從未被調用過。

這是爲什麼?我真的不明白。

這是我coffescript類:

1 class Dashing.Toggle extends Dashing.Widget 
    2 
    3 ready: -> 
    4  # This is fired when the widget is done being rendered 
    5  #@showDetails = false 
    6  @showSummary = true 
    7  @initiateView() 
    8 
    9 onData: (data) -> 
10  # Handle incoming data 
11  # You can access the html node of this widget with `@node` 
12  # Example: $(@node).fadeOut().fadeIn() will make the node flash each time data comes in. 
13 
14 
15 @accessor 'toggleDetails', -> 
16  @switchView() 
17  console.log "toggling 1" 
18 
19 initiateView: -> 
20  @summaryView().show() 
21  @infoView().hide() 
22 
23 switchView: -> 
24  console.log "Switching" 
25  if @showSummary 
26  @summaryView().fadeOut @animationLength() 
27  @infoView().fadeIn @animationLength() 
28  @showSummary = false 
29  else 
30  @infoView().fadeOut @animationLength() 
31  @summaryView().fadeIn @animationLength() 
32  @showSummary = true 
33 
34 summaryView: -> 
35  console.log "getting summary view" 
36  $(@node).find("#summary") 
37 
38 infoView: -> 
39  console.log "getting info view" 
40  $(@node).find("#info") 
41 
42 animationLength: -> 
43  1000 

回答

0

好,我只是解決了它自己:P我還是不知道爲什麼,但改變形式調用@accessor方法toggleDetails到SWITCHVIEW奇效。有誰知道爲什麼?

+1

在batman.js中,'@ accessor'用於聲明屬性。函數(包括事件處理程序)應該是實例函數,如上例中的switchView。 訪問器值被緩存,除非它們的依賴性發生變化。出於這個原因,點擊處理程序工作_once_。訪問者首次進行了評估,但未進行第二次評估。相反,緩存值(無論'console.log'返回...)被返回。 – rmosolgo 2014-09-19 21:07:47

+0

非常感謝! – mpals 2014-09-21 06:40:14

相關問題