В последнее время существует сценарий приложения, в котором пользовательский ввод отслеживается в поле ввода и inputпри его изменении отправляется ajaxзапрос серверных данных . Раньше для поиска и фильтрации требовалось, чтобы пользователи вручную щелкали или нажимали Enter , но теперь они получаются в в режиме реального времени. Я подумал, что лучше будет подать жалобу 节流
официальном сайте лодаша.на
1. Неверный пример (возникнет ошибка)
methods:{
handleFilterTags1(e) {
_.throttle(() => {
this.ajaxGetTagsAggregation(e);
}, 200);
},
handleFilterTags2(e) {
_.throttle(this.ajaxGetTagsAggregation(e), 200);
},
}
handleFilterTags1Метод ajaxGetTagsAggregation не выполняется должным образом.
handleFilterTags2Но 控制台会警告和报错ajaxGetTagsAggregation может быть выполнен нормально.Посмотрев
исходный код, он должен возвращать функцию.Слепое
предположение должно быть этой проблемой указания.
2. Учусь писать успешную отладку
methods:{
// 方式1，唯一的好处就是可以访问Vue全局挂载的lodash
handleFilterTags(e) {
_.throttle(function filterTags() {
console.log('调用了---', e, this);
const params = e ? {
tag_name: e.trim() } : {
};
this.ajaxGetTagsAggregation(params);
}, 300).call(this);
},
// 方式2, 不用自己修改this指向
handleFilterTags2: _.throttle(function filterTags(e) {
const params = e ? {
tag_name: e.trim() } : {
};
this.ajaxGetTagsAggregation(params);
}, 300),
}
Дроссель. Лучше стараться не использовать стрелочные функции.
3. Другие сцены
mounted() {
window.addEventListener('scroll', _.throttle(this.scrollBottom, 300));
},