Передача метода в lodash с помощью vue дает 'Ожидаемая функция'

Question

Передача метода в lodash с помощью vue дает 'Ожидаемая функция'

1

Я пытаюсь передать функцию Vue методу дроссельной заслонки lodash. Разве я не могу просто сделать что-то подобное?

Когда я пытаюсь сделать это, я получаю следующую ошибку:

Ошибка в обратном вызове для "запроса" наблюдателя: "TypeError: ожидается функция"

наблюдатель

watch: {
    query() {
        throttle(this.autocomplete(), 400);
    }
}

методы

methods: {
    autocomplete() {}
}

Несмотря на то, что я передаю ссылку на функцию, я все еще получаю сообщение об ошибке. Если я оберну его анонимной функцией, он не будет срабатывать:

throttle(() => { this.autocomplete(); }, 400);

Я только что проверил, и функция autocomplete действительно срабатывает, независимо от ошибки, что она не является функцией в моем примере вверху.

Что здесь происходит?

Редактировать:

Jsfiddle: http://jsfiddle.net/yMv7y/2780/

Stephan-v 07 июнь 2017, в 10:26

Источник

Теги:

javascript

vue.js

vuejs2

lodash

3 ответа

1

Я предполагаю, что вам нужно определить дросселированную функцию с не вызываемым обратным вызовом в переменной, а затем вызвать это как функцию:

var throttled = throttle(this.autocomplete, 400)
watch: {
    query() {
        throttled();
    }
}

Просто потратил довольно долго, пытаясь понять, что один из них...

Will Meier 05 янв. 2018, в 21:25

1

Рабочий подход:

var demo = new Vue({
  el: '#demo',
  data: {
    query: ''
  },
  watch: {
    query: function() {
      this.autocomplete()
    }
  },
  methods: {
    autocomplete: _.throttle(function() {
      console.log('test');
    }, 50)
  }
})

<script src="http://vuejs.org/js/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>

<div id="demo" v-cloak>
    <input type="text" v-model="query">
</div>

Как заметил @Bill Criswell,

Это создает функцию дросселирования при каждом изменении запроса. Вы хотите постоянно называть ту же дроссельную функцию, что и ответ ниже.

Egor Stambakio 07 июнь 2017, в 05:48

Ещё вопросы

str · Accepted Answer · 2017-06-07T06-37-00.000Z

Вы передаете возвращаемое значение this.autocomplete() (возможно, undefined), а не ссылку на функцию. Если вы хотите сделать последнее, вы должны опустить скобки:

watch: {
    query() {
        throttle(this.autocomplete, 400);
    }
}

Я пробовал это, но ничего не происходит, мой автозаполнение не будет срабатывать. Даже не что-то вроде console.log .
@ Stephan-v Может быть, вы должны добавить больше кода. Что такое throttle ?
Throttle - это функция lodash, которую я импортировал: lodash.com/docs/4.17.4#throttle
Это создает удушенную функцию каждый раз, когда изменяется запрос. Вы хотите постоянно вызывать одну и ту же удушенную функцию, как ответ ниже.