Vue.js Failed to resolve filter: key

转自：https://stackoverflow.com/questions/35835214/vue-js-failed-to-resolve-filter-key

I am following this tutorial https://laracasts.com/series/search-as-a-service/episodes/2 and got stuck on the following error

[Vue warn]: Invalid expression. Generated function body:  scope.keyup:scope.search

[Vue warn]: Failed to resolve filter: key

shown in console.

This is the code.

<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>