Vue.js无法解析过滤器：关键

Question

我下面这个教程https://laracasts.com/series/search-as-a-service/episodes/2和被困在控制台中显示以下错误

[Vue warn]: Invalid expression. Generated function body: scope.keyup:scope.search 
[Vue warn]: Failed to resolve filter: key 

。

这是代码。

<input type="text" v-model="query" v-on="keyup: search | key 'enter'"> 
    <div class="results"> 
     <article v-for="movie in movies"> 
      <h2> @{{ movie.name }}</h2> 
      <h4> @{{ movie.rating }}</h4> 
     </article> 
    </div> 
</div> 

    <script src="http://cdn.jsdelivr.net/algoliasearch/3/algoliasearch.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.17/vue.js"></script> 
    <script> 
     new Vue ({ 
      el: 'body', 
      data: { query: '' , movies: [] }, 


      ready: function(){ 
       this.client = algoliasearch('AH9XU5726U', '58fd00912ce725b3f627cfa6cb8292ee'); 
       this.index = this.client.initIndex('getstarted_actors'); 
      }, 
      methods: { 
       search: function() { 
        this.index.search(this.query, function(error, results){ 
         this.movies = results.hits; 
        }.bind(this)); 
       } 
      } 

     }); 
    </script> 

我错过了什么吗？或者是教程过时了？

Answer 1

v-on="keyup: search | key 'enter'" 

是旧版本的声明，改成这样：

v-on:keyup.enter="search" 

http://vuejs.org/guide/events.html#Key_Modifiers