How to filter on click in Vue?

Question

Vue.js

Parsing the task from the tutorial on Vue js. I can't figure out why filtering by clicking on the "Filter" button doesn't work for me? After clicking, only numbers less than 10 should remain in the list. You need to do it using the filter method.

let appMeth5 = new Vue({
  el: '#app11',
  data: {
    items: [1, 25, 32, 4, 5],
  },
  methods: {
    filter: function() {
      this.items.filter(function(elem) {
        if (elem < 10) {
          return elem;
        }
      });
    },
  },
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app11">
  <ul>
    <li v-for="item in items"> {{ item }} </li>
  </ul>
  <button v-on:click="filter">Фильтровать</button>
</div>

Answer 1

You are using the filter method incorrectly.
First, its callback should not return the value of the array element, but a boolean value indicating whether or not to include the element in the result.
Secondly, filter does not change the original array, but returns a new one.
this.items = this.items.filter(el => el < 10);

Answer 2

Because you are not changing the original array. You just need to do this:

this.items = this.items.filter(function(elem) {
        if (elem < 10) {
          return elem;
        }
      });

Here is the usual js))