VueJS - 事件「單擊」無效處理程序：未定義

我有點擊時想要編輯的元素列表。我在其他組件有類似的解決方案，它工作得很好，但在新的它不是，也找不到原因。VueJS - 事件「單擊」無效處理程序：未定義

當組件被渲染我： Invalid handler for event "click": got undefined

列表：

<div v-for="annt in anns" class="item two-lines" v-if="!anntInEdit"> 
      <div class="item-content has-secondary" v-on:click="edit(annt)"> 
      <div> 
       {{ annt.title }} 
      </div> 
      <div > 
       {{ annt.body}} 
      </div> 
      </div> 
      <div class="item-secondary"> 
      <a><i >delete</i></a> 
      </div> 
     </div>

JS：

edit (annt) { 
     if (this.anntInEdit == null) { 
      this.anntInEdit = annt 
      this.anntInEditBackup = Object.assign({}, this.anntInEdit) 
     } 
     this.anntInEditIndex = this.anns.indexOf(annt) 
     },

當我將只按一下，我得到了公佈與形式編輯SNF DIV顯示，我可以使用保存（ajax），取消（只需設置爲無）等，但只要我觸摸任何輸入內編輯div我得到： [Vue warn]: Invalid handler for event "click": got undefined vue.common.js?e881:1559 Uncaught (in promise) TypeError: Cannot read property 'invoker' of undefined 只要出現錯誤，版本中的任何按鈕都根本不起作用。

相同的div用於新建/編輯，並且對於新的通知工作非常合適。任何想法？

整個元件引擎收錄：http://pastebin.com/JvkGdW6H

來源

2016-11-20 M U

可能是一些小錯誤，如果你發佈整個組件結構。 –

我今天晚上會做，我家有代碼 –

整個組件：http：//pastebin.com/JvkGdW6H –

明白了。這不是關於頂級功能@click。這是關於@click的元素，當最高級別點擊被調用時，它正在呈現。我在函數名中有一個拼寫錯誤。不幸的是，Vue沒有拋出缺失函數的名稱，這就是爲什麼我找不到它的原因，因爲我在錯誤的地方看...

來源

2016-11-21 21:47:24

我真的不跟隨的問題，可能是一個很好的發佈更完整的示例。但是看起來您需要使用該項目的索引。這應該有助於你抓取正確的物品。這就是說，如果點擊事件未定義，那麼它聽起來像它沒有在該組件上註冊。

以下可以幫助作爲一個例子...

new Vue({ 
 
    el: '#app', 
 
    data: { 
 
    \t anns: [ 
 
    \t { state: 'none' }, 
 
     { state: 'none' }, 
 
     { state: 'none' }, 
 
    ], 
 
    }, 
 
    methods: { 
 
    \t edit (index) { 
 
     this.anns[index].state = 'editing' 
 
    }, 
 
    }, 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.8/vue.min.js"></script> 
 
<div id="app"> 
 

 
    <div v-for="(annt, index) in anns"> 
 
    <button v-on:click="edit(index)">edit</button> 
 
    <p>state: {{ annt.state }}</p> 
 
    </div> 
 

 
</div>

來源

2016-11-20 20:52:47 GuyC

試過了。拋出完全相同的錯誤... –

是的，如果你有組件中的錯誤，上面不會解決這個問題，更多的是如何重構的例子。如果您發佈完整的組件，那麼我們可以對其進行故障排除。 – GuyC

我今天晚上會做，我家裏有代碼 –

VueJS - 事件「單擊」無效處理程序：未定義

回答

相關問題