2016-12-01 2 views
0

Я строю функцию, которая выполняет запрос API при нажатии клавиши, но я хочу, чтобы это было дебютировано.Debouncing не работает с приложением React-Redux

Это в настоящее время не работает и выдает ошибку: lodash.js:10319 Uncaught TypeError: Expected a function

Вот фрагмент кода с лог консоли вместо запроса асинхронной, который также не работает!

import React from 'react'; 
const _ = require('lodash'); 

const method =() => { 
    return _.debounce(testFunc(), 3000); 
}; 

const testFunc =() => { 
    console.log('echo echo test test'); 
}; 


const SearchBox = ({ onTypingSearch, searchTerm }) => (
    <form> 
     <p>Search: {searchTerm}</p> 
     <input 
      onChange={(e) => { 
       console.log(e.target.value);     
       onTypingSearch(e.target.value); 
       console.log(method); 
       method(); 
      }} 
       value={searchTerm} 
     /> 
    </form> 
); 

export default SearchBox; 

ответ

3

Вы должны дребезга функцию, а не результат вызова его:

Это:

const method =() => { 
    return _.debounce(testFunc(), 3000); 
}; 

Для этого:

const method =() => { 
    return _.debounce(testFunc, 3000); 
}; 

Update:

То, как вы установили s вверх, method возвращает функцию деблокирования. Поэтому вызов method() вернет функцию. Тогда вам придется называть это: method()().

Лучше сделать это:

const method = _.debounce(() => { 
    return testFunc(); 
}, 3000); 

И если вы хотите арг:

const method = _.debounce((e) => { 
    return testFunc(e); 
}, 3000); 

Затем вы можете продолжить звонить так, как вы делаете в данный момент: method().

+0

Я пробовал это, но тогда моя функция не выполняется? – darkace

+0

Также как вы могли бы передать аргумент функции, если вам нужно? – darkace

+1

Из [docs] (https://lodash.com/docs/4.17.2#debounce): 'Функция func вызывается с последними аргументами, предоставленными дебютанной функции' –

Смежные вопросы